Need hack for ie9 only

Question

Is there a hack to target IE9 only? I am facing a problem in IE9 only, other browsers are working fine. I am using \9, but it is effecting IE8 as well.

I don't want to use conditional comments.

Answer 1

You can use this :root #element { color:pink \0/IE9; } /* IE9 + IE10pp4 */

Answer 2

I came up with a media query that does this as well. It specifies only IE9.

@media all and (min-width:0\0) and (min-resolution:.001dpcm)
{
    #div { color:red; }
}

Other ones I have worked out, including a msie 9+ media query are on my github page: https://github.com/jeffclayton/css_hack_testing - most of these I have sent to browserhacks.com for inclusion.

2017 UPDATE: To see it working, I created a live test page here for this and many others I worked on http://browserstrangeness.bitbucket.io/css_hacks.html and MIRROR: http://browserstrangeness.github.io/css_hacks.html

Please be aware it is min-width:0\0 (zero-backslash-zero) when you copy the code to your own site. Not to be confused with min-width:0 (just a single zero) which does not work to differentiate IE9 from other browsers.

Answer 3

There is another way!

:root #div { background: #fff \0/IE9; }  /* IE9 */

Use the :root psuedo selector. This works because the @media all and (min-width:0) part as been removed in favor of this method in IE9.

Be aware though, that this is not a safe method as it doesn't work on all selectors. The best thing to use is conditional comments, it is the safest, easiest and best way to target different versions of Internet Explorer except IE10 which has dropped the support for conditional comments.