[Last Call] Learn how to a build a cloud-first strategyRegister Now


CSS media type for all except print

Posted on 2007-10-09
Medium Priority
Last Modified: 2008-01-09

I understand that there are 7+ media types for CSS.

I want a special stylesheet for print but all other media should use the same stylesheet.

<style type="text/css" media="print">@import "print.css";</style>
<style type="text/css" media="all except print">@import "main.css";</style>
Question by:hankknight
  • 2
LVL 13

Expert Comment

ID: 20039332
I think (but am not 100% sure) that leaving out the media attribute will do what you want.

<style type="text/css" media="print">@import "print.css";</style>
<style type="text/css" >@import "main.css";</style>
LVL 16

Author Comment

ID: 20039589
Thanks for the idea R7AF but no, your idea loads BOTH style sheets for the print version.
LVL 13

Accepted Solution

R7AF earned 2000 total points
ID: 20040167
You have the following options. You should call the print css after the default one. Then the print.css will overrule the css-rules in main.css. Still, this could mean you have to undo many rules that are screen-specific. To avoid this you could create a third stylesheet, default.css (first in the list!). This has rules for all media. Then you have screen.css for screen specific rules, and print.css for print.

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
Suggested Courses

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question