IE9 Standard View No Load CSS

IE9 standard view no load CSS

IE9 is known to reject stylesheets which are not sent using "text/css" MIME type. This is a new security enhancement, but it's catching a few people off guard. Is your CSS file dynamically generated? Make sure its getting passed as 'text/css'.

More info: http://blogs.msdn.com/b/ieinternals/archive/2011/03/27/http-406-not-acceptable-php-ie9-standards-mode-accepts-only-text_2f00_css-for-stylesheets.aspx

Another try:: It's not just 'text/css' in the doc that needs to be correct, you need to make sure your local IIS is sending it with the proper headers. "If a style sheet is ignored due to an incorrect MIME-type, your site may fail to render as expected. Text, images, or other features may lack the desired styling. If a style sheet is ignored because it does not bear the correct MIME-type, a notification will be logged in the IE9 F12 Developer Tools console."

http://msdn.microsoft.com/en-us/library/gg622939%28VS.85%29.aspx

IE9 Not applying linked style sheets

IE9 does not load css fully

Bit late but for future visitors of this thread: I had the same problem and found out my project just had gotten too big. IE9 stops reading your stylesheet after 4095 selectors.

For reference: Does IE9 have a file size limit for CSS?

Why is css missing after refreshing on IE9?

This sounds like if the css file is loaded from cache when you navigate normally, but fails to load when it has to be reloaded because you refresh the page. This would mean that it has existed before, but now is inaccessible. Did you try opening the css url in browser?

IE9 in compatibility mode not displaying CSS styles correctly

Internet Explorer has a compatibility "feature" where it always renders sites that are on the local network in compatibility mode. You have to explicitly turn this off in one of two ways.

<meta http-equiv="x-ua-compatible" content="ie=edge" />

This edge marker tells ie to always render in it's most standard mode it supports.

The other method (which I prefer) is used if you are using a server side technology like asp.net or php, which is to add an http header (in asp.net this goes in global.asax, also the chrome=1 enables chromeframe if installed):

protected void Application_BeginRequest() 
{ 
    Response.Headers.Add("X-UA-Compatible", "IE=edge, Chrome=1"); 
}

EDIT:

There is also a third way, and that's to disable it in the compatibility view tab in Internet Options. This only affects your computer, however.

Also, it's better t use the header method if at all possible, rather than the meta tag method. By the time the browser has read the metatag, it's already in it's primary mode. The meta tag only affects the document rendering mode, rather than the browser compatibiltiy mode. There is a subtle difference that can, in some cases, have an affect.

CSS Style not recognized in IE9

Finally I have solved this problem.
The problem was that I had added a new CSS class named "container" in the file. I am not sure if this is some bug in IE and FF, but CSS file was getting clipped at start of that style. I found this out by looking in the developer tools for IE. When i looked at loaded file in IE, it was not complete. All my styles related to my UL/LI tags were present after that class definition. After I deleted "container" class from file, everything went back to normal.

Thanks for all your input and suggestions.

How prevent a style sheet from loading in IE including versions 10 and 11

<!DOCTYPE html>
<html>
<head>
    <title> overwrite cssText if IE.  ewww nasty.  </title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type=text/css>
        body { font-family:'Segoe UI',sans-serif; font-size:14pt; color:black }
        #customLook { display:inline-block; margin-top:50px; margin-left:50px }
    </style>
    <link id=animstyle rel=stylesheet type=text/css href=animstyle.css>
    <script>
        var s= (animstyle.sheet||animstyle.styleSheet)                  // w3c-browser OR ie8
        if (s && s.cssText) s.cssText= ".customSpan:before{content:'not ';color:red}"   // only IE implements sheet.cssText  (including Edge)  it's r/w.
    </script>
</head>
<body>
    <div id=customLook>
        <span class=customSpan>ANIMATED</span>
    </div>
</body>
</html>

try this online demo

Actually, you could put s.disabled=true instead, and then enable some other css link. That'd be more proper. But I just had to post this, because it's so nasty.

Edit Here's an easy way to disable one sheet and replace it with another:


        <link id=animstyle rel=stylesheet type=text/css href=animstyle.css>
        <script>
            var s= (animstyle.sheet||animstyle.styleSheet)                  // w3c-browser OR ie8
            if (s && s.cssText) s.disabled= true                        // only IE implements sheet.cssText  (including Edge)  it's r/w.
        </script>
        <link rel=stylesheet type=text/css href=NOanimstyle.css onload="(this.sheet||this.styleSheet).disabled=!s.disabled">

demo ver2

Target IE9 Only via CSS

I suggest using condcoms to feed an IE9 css file or have a conditional html class, similar to:

<!--[if lt IE 7]> <html lang="en-us" class="no-js ie6"> <![endif]--> 
<!--[if IE 7]>    <html lang="en-us" class="no-js ie7"> <![endif]--> 
<!--[if IE 8]>    <html lang="en-us" class="no-js ie8"> <![endif]--> 
<!--[if gt IE 8]><!--> <html lang="en-us" class="no-js"> <!--<![endif]-->

Internet Explorer fails to load css files

I'm not sure but it might be a caching problem since your styles are interpreted as inline-css and won't be saved when you open a new window. Did you try to use:

<link href="yourcssfile.css" type"text/css" rel="stylesheet"/>

UPDATE:
It seems to be a bug. I found your problem in this article (point5). Solution is in there aswell.

http://www.webcredible.co.uk/user-friendly-resources/css/internet-explorer.shtml

IE9 Standard View No Load CSS