Microsoft says: de-hack your CSS

    Kevin Yank

    The IEBlog has appealed to Web designers to ask them to do away with a number of hacks that are commonly used to apply CSS formatting in Internet Explorer only. These are the most common hacks in question:

    Many of the CSS parsing quirks that these hacks are based on have been fixed in IE7, meaning that the IE-specific formatting they apply will not be applied in IE7.

    Now, if the IE rendering quirk your hack was designed to work around has been fixed in IE7 too, that’s just fine. But if if hasn’t, then your site’s design will break in the new browser.

    Microsoft is hoping developers will instead use the more predictable conditional comments feature of Internet Explorer 5 or later to put IE-only CSS in a separate style sheet, which will only be used by that browser:

    <!--[if IE]><link rel="stylesheet" href="ieonly.css" type="text/css" /><![endif]-->

    But as I said, due to the many rendering fixes forthcoming in IE7, you’ll only want some of your IE-specific CSS to apply in IE7. You’ll therefore need to divide up your IE-specific styles even further. Using more complex conditional comments, you can create style sheets that apply to IE7 or earlier, IE6 or earlier, IE5.5 or earlier, and so on.

    <!--[if lte IE 7]><link rel="stylesheet" href="ie7.css" type="text/css" /><![endif]-->
    <!--[if lte IE 6]><link rel="stylesheet" href="ie6.css" type="text/css" /><![endif]-->
    <!--[if lte IE 5.5]><link rel="stylesheet" href="ie55.css" type="text/css" /><![endif]-->

    Of course, until Microsoft releases a public beta of Internet Explorer, we won’t know just which fixes to keep (in ie7.css), and which to deliver only to older browsers (in ie6.css).