IE7 and @import media types

Warning This article was written over six months ago, and may contain outdated information.

The more I use IE7, the more I hate it. Yes, it’s more standards-compliant and feature-rich than IE6; but if the best you can say about your browser is that it’s better than IE6, you’re not starting from a strong position. IE7 is better than IE6 as receiving ten smacks in the head is better than receiving twelve.

The reason I’m annoyed at IE7 today is that I’ve just found out they still haven’t implemented media types on the @import rule. If you’re not sure what this is, it’s a shorthand way to apply stylesheets only to specific media. Say, for example, we want to apply an external stylesheet called print.css which will apply only to printed documents; easy enough, you just do this:

<style type="text/css">
@import url('print.css') print;

Easy, right? Not for IE7, no. It just doesn’t read the stylesheet at all. OK, there are a number of alternatives to this;

<style type="text/css" media="print">
@import url('print.css');

for example; or just using the plain old link element:

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

But that’s not the point. Using media types on the @import rule was implemented in CSS2, which became a release candidate in 1998. That’s at least eight years that the IE team have had to think about implementing this. If they already support media types in the link and style elements, how hard could it have been to add it to the @import rule?

7 comments on
“IE7 and @import media types”

  1. Thanks for the writeup on this, it had been confusing me for a while why my @import statements weren’t working in IE7… I never even thought this would be a feature they have yet to implement. It’s really a shame.

  2. indeed, they should have implemented this long time ago. :(

  3. […] chance to run a few more tests to find out what’s new (and what’s not) in IE8. Good: @import media types seem to be implemented; Bad: XHTML still isn’t parsed, so everyone who thinks they are coding […]

  4. I’m I wrong, or does IE7 not support the @import rule at all??

    Dave Campbell [August 24th, 2008, 04:28]

  5. @ Dave: No, it does support @import; just not with media types.

  6. Its annoying (to put it mildly) and I wasted several days tracing why script that had previously worked but didn’t with a slightly changed design. Yes the problem was ie7 and @import with media select

    I then realised that media select wasn’t needed as the calling script was already media selected via its html link. Had it not been then I could have media selected within the import file.

    I’ve hated ie since I 1st tried css back in my ns4 days — maybe ie8 will change my mind — and watch out for flying pigs.

    James Montague [March 5th, 2009, 12:28]

  7. Thanks a ton! I found this post and I believe it explains why my Google AJAX Implementation of a video bar isn’t working in IE7 and works in everything else! Implementing your workaround right now…