At work we came across this issue where we’re trying to get a printer style working on our website, and I found that my printer style was getting overwritten by the screen styles of the website. The printer style is set in the header before all of the screen styles like this:
<link rel="stylesheet" type="text/css" href="/Styles/print.css" media="print" />
However, our screen stylesheets are set like this on the template after the print style:
<link rel="stylesheet" type="text/css" href="/Styles/style[COLOR=black].css[/COLOR]" />
Notice that this last style doesn’t have a “media=” attribute to it. I saw conflicting things online that stated if you don’t specify a “media=” attribute, it then defaults to media=“all”. I then saw on the Opera support site that the default is to set it to media=“screen”. Does anyone know which is true? This is only for using the <link> reference for loading css files. Thanks!
I’ve always used a format like this and so far I have not had a problem.
<link rel="stylesheet" href="/includes/css/global.css" media="screen,projection" type="text/css" />
<link rel="stylesheet" href="/includes/css/print.css" media="print" type="text/css" />
…and inside my global.css is the imports to the other stylesheets.
[FONT=monospace]
[/FONT]@import url('reset.css');[FONT=monospace]
[/FONT]@import url('i_hate_ie.css');[FONT=monospace]
[/FONT]
Thanks for the reply…I do know how to set up the links to the stylesheets, I was mainly just concerned about the media= attribute which isn’t set on our screen styles, and seem to be overriding the printer styles I’ve been working on. Would you happen to know what the default value is for “media=” in the <link> definition of a style, if “media=” isn’t defined? So for example:
<link rel=“stylesheet” href="/includes/css/global.css" type=“text/css” />, where media= isn’t defined, what’s the default value of media then? Is is media=“all”, or media=“screen”?
According to w3c…
media = media-descriptors
This attribute specifies the intended destination medium for style information. It may be a single media descriptor or a comma-separated list. The default value for this attribute is “screen”.
And I was just showing you the way I set up my <link /> tags and that I had never had a problem with them ‘overwritting’ (as you say) each other so you could try it that way if you wanted.
Awesome, thanks for that info, that really helps me out. You wouldn’t happen to have a link to that page would you?
I didn’t mean to sound rude about how you set up the <link> tags, there just isn’t a lot of flexibility here because I’m working with a CMS that creates its own <link> tags for styles, and they can’t be set manually. Thanks again!
