How to avoid IE CSS hacks using conditional classnames

Paul Hammond reminds us that IE conditional comments also work in the HTML code.

It’s quite neat because that way you can avoid IE CSS hacks (like the infamous “* html” hack) and use a class instead.

Mirror :

If you use this HTML:

<!--[if IE ]>
  <body class="ie">
<![endif]-->
<!--[if !IE]>-->
  <body>
<!--<![endif]-->

with CSS that looks something like:

div.foo {
    color: inherit;
}
.ie div.foo {
    color: #ff8000;
}

then you get all of the advantages of using conditional comments to work around problems in Internet Explorer, without the extra HTTP request of an IE-only stylesheet.

Thanks to Paul, and thanks to Rik24@ for the heads up.