#element { color:orange; } #element { *color: white; /* IE6+7, doesn't work in IE8/9 as IE7 */ } #element { _color: red; /* IE6 */ } #element { color: green\0/IE8+9; /* IE8+9 */ } :root #element { color:pink \0/IE9; } /* IE9 */ /* irrelevant to the demo */ body{ font-family:sans-serif; background:#000; } a{ background:blue; color:#fff; }
<div id="element"> <ul> <li>IE6 should be red</li> <li>IE7 should be white</li> <li>IE8 should be green</li> <li>IE9 should be pink</li> <li>Everything else should be orange</li> </ul> <em>This is an example demonstrating the <a href="http://blog.vervestudios.co/blog/post/2011/05/13/IE9-Only-CSS-Hack.aspx">IE9 Only CSS Hack</a>.</em> <pre> \0/ | / \ </pre> </div>