Applying Special CSS Rules for IE6-IE8 and IE9 Without Affecting Other Browsers

It’s been a while since I blogged about this \9 CSS hack for all versions of Internet Explorer. Personally I always try to avoid hacks, but recently I had to tweak some style sheet to use special styles for IE6-IE8 and for IE9, so I remembered of this hack. Here’s how I did it:

/* first apply the \9 hack for any version of internet explorer, for example */
body
{
    background: #f00\9;
}

/* ... then override the above rule by using the CSS3 :root selector which is supported by IE9, but still use the \9 hack to filter out only IE9 */
:root body
{
    background: #ccc\9;
}

By using the above CSS you can have special styles, which are the same for Internet Explorer 6-8 and other rules for Internet Explorer 9 without affecting other browsers.

Advertisements

One comment

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s