Search code examples
htmlcssstylesheetinternet-explorer-11conditional-comments

Loading css (stylesheet) ONLY for IE11


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


Solution

  • 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; }