Dougal Campbell's geek ramblings

WordPress, web development, and world domination.

IE7 and the demise of CSS hacks

As mentioned previously here and elsewhere, Microsoft is working on Internet Explorer 7, which will have greatly improved CSS support. The IE7 team has posted an article about the demise of CSS hacks and broken pages, warning that the hacks often used to target CSS specifically to work around old IE bugs may be unnecessary under IE7 when in strict mode. So, IE will finally have improved support for standards, but all of our old hacks could cause breakage in the new browser. As Monk would say, “it’s a blessing and a curse.”

The recommended workaround is to use IE’s conditional comments feature to load a stylesheet with rules specifically for IE6 and older. For example you might put something like this in the <head> of your document:


<link rel="stylesheet" type="text/css" href="compliant.css" />
<!--[if IE lt 7]>
<link rel="stylesheet" type="text/css" href="ie-rules.css" />
<![endif]-->

This would load the compliant.css file for all browsers. Then, the conditional comment would load the ie-rules.css file only for Internet Explorer with a version less than 7. All other browsers (including IE7) would ignore this comment. [Note, however, that this hack doesn’t apply to the specific Slashdot example used in the IEBlog article. Read the comments to see why.]

Note that this only applies if you are using IE-specific hacks in standards-compliance mode. This includes hacks which target rules to only work in IE (like my favorite, the star html hack), or rules that only work in compliant browsers (like the child selector hack). And it may not be necessary in all cases anyhow, depending on how you are using those rules (the main problem is probably going to be that the star html hack won’t work in IE7 even in quirks mode). Theoretically, if you are using quirks mode, then you can probably just continue using your old hacks. However, I think most of us would probably prefer to keep to the standards whenever possible.

About Dougal Campbell

Dougal is a web developer, and a "Developer Emeritus" for the WordPress platform. When he's not coding PHP, Perl, CSS, JavaScript, or whatnot, he spends time with his wife, three children, a dog, and a cat in their Atlanta area home.
This entry was posted in Browsers, CSS, Design, Standards and tagged , , , . Bookmark the permalink.

18 Responses to IE7 and the demise of CSS hacks

  1. Craig says:

    The saga continues. IE7 will ultimately NOT be the panacea we are all hoping for, given the fact that so many users will use legacy versions. If anything, this will just introduce another level of complexity (relatively speaking) to the job of creating good CSS for a site.
    heavy sigh

  2. Brad says:

    I’m going to agree with Craig. I mean, nice that MS is jumping on the CSS bandwagon (however many years too late), but I don’t trust them not to (inadvertently or deliberately) screw up something else important, and more people will still be using IE6 than IE7 for at least the first year.

    So don’t throw away those IE hacks yet. :)

  3. Pingback: Techniek » IE 7 en CSS hacks

  4. Matt Cahill says:

    I don’t really care about having to deal w/ older IE workaround screwing up in IE7, if anything that proves Microsoft is finally doing their job and getting it (for the most part) right. It makes perfect sense to remove all IE-specific hacks and keeping them in a separate CSS file anyway, so no big deal and a good suggestion for getting around this looming problem.

  5. Anonymous says:

    Who cares, Firefox owns.

  6. Ozzie says:

    @Anonymous: I have to disagree with that. Opera clearly owns firefox. But I’m hoping the next version of Firefox (which is currently under alpha stage) will owns Opera when it’s fully distributed.

  7. Sören says:

    I think this is MSs own fault. Leaving a market leading product as IE was for such an evolving technology like the web in an abandoned state for many years, isn’t the right way to support a broad user base. Again MS is going the easy way and telling the webdevs they should change their pages to fit to some new weird way IE7 will interprete HTML layout? No, thank you. If IE7 will be a standard compliant webbrowser, I don’t have to change anything on my webpage to be displayed the way it should be.

  8. Tron says:

    Hallo, Dougal!

    I have installed ‘Boxy But Gold’ and you are there, in its blogroll. Thanks for your contribution and happy day! I hope you don’t think I am a spammer.

    Saludos from EU-Spain-Canary Islands

  9. praetorian says:

    “Much-improved.” I have a better idea. How about just adhering to the standards? Nice try, Mr. Gates. Personally, I don’t care what MS intends to do – the world is already passing it by.

  10. Anonymous says:

    What I can’t believe this… MS sucks. It’s simple I can’t believe there’s even a debate. Poor security, poor standards implementation. How hard can it be? Follow the guidelines set forth. All of the browsers do something out of wack but, MS IE just takes the cake.

    Why don’t developers just take a stand and not change, not switch. Make MS change, they have the money and resources to get it together. Why have thousands of web sites and developers change instead of 1 company with 1 application.

  11. Pingback: Web Standards Project BUZZ

  12. Pingback: Syntetica CTRL+C » Blog Archive » Pandora’s Box (Model) of CSS Hacks And Other Good Intentions

  13. I agree Craig that it will indeeed create a new breed or another level of creating great look css. Great read found it on the webstandards site before getting here and was glad to see they added it to there buzz worthy!

  14. Nick Gagne says:

    There is a hack that works for all versions of internet explorer, including IE7. You can find it here:
    IE7 CSS Hack

  15. Britney says:

    Thansk for the link Nick always fun learning more Hacks!

  16. Anonymous says:

    well there we go again – we have to effectively build three sites for every one we produce as ie6 doesn’t respond in the same way as ie7 which again is different from the Mozilla browsers – ultimately costing more time to build a website than ever! and as for the end of hacks – they are more varied and complicated than any i have had to use before – so i agree thanks a bunch mr richest man in the worlD!

  17. n008 says:

    This really sucks. Contrary to what MS seems to think, they’ve merely created MORE need for hacks, since IE7 doesn’t display standards compliant CSS correctly EITHER, but also kills off many of the hacks and work arounds of IE6 and below. Way to go MS on completely dropping the ball, even AFTER being nearly a decade late to the party.

  18. Artem says:

    I didn’t know about these bugs of IE. That’s why I think that there is no better browser than Mozilla is.

Leave a Reply

%d bloggers like this: