How do I specify IE 11 specific css file?

Question

I currently have a page for which I am applying some browser specific CSS styling when user clicks print button using the following html syntax. But the following html code wont apply the css specified for IE11(ie11print.css) instead it applies the css that is specified for rest of the IE versions(ieprint.css).

<!--[if IE 11]> <link rel="stylesheet" media="print" title="Print" type="text/css" href="/styles/ie11print.css" /><![endif]-->
<!--[if lte IE 10]> <link rel="stylesheet" media="print" title="Print" type="text/css" href="/styles/ieprint.css" /><![endif]-->
<!--[if !IE]>--><link rel="stylesheet" media="print" title="Print" type="text/css" href="/styles/print.css" /><!--<![endif]-->

Does anybody know how to specify a CSS file only for IE11? Thanks in advance.

You shouldn't need to ...anyway IE11 doesn't support conditional comments. — Paulie_D
– Paulie_D, Commented Jan 27, 2015 at 11:58
What is IE 11 doing so differently from other browsers that you would need to include a custom stylesheet to fix it? — Sampson
– Sampson, Commented Jan 28, 2015 at 0:01
i have decreased the page size using zoom:70%; for all IE versions using ieprint.css file and it is working perfectly in all IE versions but in IE 11 it is much smaller compared to other IE browsers. I dont want to use zoom at all in IE11. — Sachin B. R.
– Sachin B. R., Commented Jan 28, 2015 at 8:10
As @Paulie_D mentioned, Microsoft dropped conditional comments after version 9. Your IE10 conditionals won't work either. — Jeff Clayton
– Jeff Clayton, Commented Feb 7, 2015 at 16:23

rajesh · Accepted Answer · 2015-01-27 11:58:33Z

6

Use the below hack and followed by your css style:

*::-ms-backdrop,

Example:

*::-ms-backdrop,/*Your element*/ {
       /*Your styles*/
    }

Note:It will only affects in IE browsers.So You need to apply your normal style before this.

answered Jan 27, 2015 at 11:58

rajesh

1,48511 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Disha · Accepted Answer · 2015-01-27 12:01:11Z

5

Just add below in your CSS stylesheet and see in Internet Explorer 11

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) 
 {                                                                                                                     
             Add your styles here
 }

answered Jan 27, 2015 at 12:01

Disha

3922 silver badges7 bronze badges

1 Comment

Sachin B. R. Over a year ago

Thanks @disha. Will try this and let you know

pareshm · Accepted Answer · 2015-01-28 05:29:20Z

1

check for if browser is ie11

then directly add link tag from javascript

         window.location.hash = !!window.MSInputMethodContext;
            if (window.location.hash) 
            {
                var $head = $("head");
                var $headlinklast = $head.find("link[rel='stylesheet']:last");
                var linkElement = "<link rel='stylesheet' href='/styles/ie11print.css' type='text/css' media='screen'>";
                if ($headlinklast.length){
                   $headlinklast.after(linkElement);
                }
                else {
                   $head.append(linkElement);
                }
            }

let me know if any concern. window.location.hash will return true for ie11

edited Jan 28, 2015 at 5:29

answered Jan 27, 2015 at 12:15

pareshm

5,0445 gold badges37 silver badges54 bronze badges

2 Comments

pwdst Over a year ago

jQuery.browser was deprecated in version 1.3 and removed in 1.9 (see api.jquery.com/jQuery.browser) - I'd also have serious doubts if it can detect Internet Explorer 11 based on the significant changes to the user agent string in that version and the non-supported nature of the method.

pareshm Over a year ago

//Appends true for IE11, false otherwise window.location.hash = !!window.MSInputMethodContext; you can use this robust method to detect ie11

Collectives™ on Stack Overflow

How do I specify IE 11 specific css file?

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related