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.

Was it helpful?

Solution

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

OTHER TIPS

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.

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.

In my IE9 EMULATOR none of the solutions listed worked. The only hack that properly enabled us to resize, for example, a checkbox in IE9 was:

/* IE9 */
:root input#my-checkbox {
    width:20px !important \ ;
    height:20px !important \ ;
    box-sizing:content-box !important \ ;
}

I don't know if this also affects IE8 or IE10 etc but we have conditionals handing those separately anyway.

Hopefully this helps someone.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top