Loading css (stylesheet) ONLY for IE11

html css stylesheet internet-explorer-11 conditional-comments

Shubh · Dec 30, 2014 · Viewed 13.4k times · Source

I want to load a css file only for IE11 browser. How can I do it?

I understand that I can use conditional comments to load stylesheet's for IE <=9. But not for IE 10 & 11.

I could Google and find an alternative as below :

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
}

But, it loads for both IE10 and IE11 browsers. I want to load stylesheet only for IE11. Is it possible?

Thanks

Answer

If it's only IE11

@media all and (-ms-high-contrast:none)
 {
 .foo { color: green } /* IE10 */
 *::-ms-backdrop, .foo { color: red } /* IE11 */
 }

If you're targeting IE 9, 10, 11 you can try

@media screen and (min-width:0\0) { 
    /* Enter CSS here */
}

If it's for IE10+

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10+ specific styles go here */  
}

Also, a google search came up with this

_:-ms-fullscreen, :root .ie11up { property:value; }