Ciaran McNulty

An odd one today at work, a site had the following:

<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="print.css" media="print" />

What was puzzling was that when you printed the page from Firefox, none of the styles from styles.css were being applied. I for one had assumed that it would be inherited.

It turns out that it's not clear what the default media value for the link element is. The HTML4 spec says:

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".

Pretty clear-cut, although maybe not what I expected - looks like if the media attribute is missing the styles only apply to screens. But hang on, look what the HTML5 spec says:

The default, if the media attribute is omitted, is "all", meaning that by default links apply to all media.

That's a more sensible default of course, but it's unusual to see the HTML5 spec completely change behaviour like this. The fact it has changed indicates that browsers are (currently) being inconsistent about which value to default to.

For now, it seems sensible to always declare a media value in your links, and not make assumptions like we did!