IE9 Not Applying Linked Style Sheets

IE9 Not applying linked style sheets

Maybe your server do not send the right mime-type
http://msdn.microsoft.com/en-us/library/gg622939%28VS.85%29.aspx

Not all CSS styles applied when page opened in IE 9 in a frame, which puts it into Quirks mode

The only thing that worked thus far was going into the menu, Tools/Compatibility View Settings and un-cheking Display Intranet sites in Compatibility View checkbox.

Still looking for a programmatic solution, as this is nothing but a per-user workaround.

IE Not Applying Styles

I tried your page, and it works fine in Chrome. However it looks weird in IE9, as if the CSS styles are not being applied, just as you described. For example, the style body#manage-sessions #main_container #login_container is not getting applied. I looked at the css tab in the developer tools, and it turns out the style is not even there, which explains how it is not working. To find out why, I used the networks inspector from the developer tool and examined the response when IE9 is downloading the css, and the style body#manage-sessions #main_container #login_container is indeed in the response. This lead me to believe that there must be some limit on the max css file size for IE. It appears that this is indeed the case as described here. Apparently IE simply ignores additional styles if the css file gets past a certain size. So this explains why everything works when the css files are separate, and why things fall apart after you combine them. To solve the problem try splitting up your large css file into 2 or more smaller ones that fall under the IE limit, and see if this corrects the problem.

IE8 / IE9 does not load CSS

The problem you have is due to a limit that IE imposes on the number of stylesheets. IE can only load a maximum of 31 separate CSS files in a single page.

There are plenty of references for this one the web, but here's one from MSDN

This is a hard limit in IE. It is possible to load more CSS files than that by using specific techniques: if you use @import to load CSS files from inside others, it is possible to import up to 31 files for each of the 31 main CSS files. But it's not an ideal solution.

In general, it's better to reduce the number of files if possible -- each file that loads is a separate HTTP request, and having large numbers of requests can have a significant impact on page load performance.

My suggestion would be to try to combine the large number of CSS files you have into fewer files. This shouldn't be a difficult task, but there may be WP plugins you could use that would do this for you automatically if necessary.

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?

Internal stylesheet not working in IE9 with jsf

I checked your website chennaivolunteers.org and I noticed that FacesServlet is been mapped on an URL pattern of /faces/* instead of *.xhtml. As you're using only relative <link> and <script> resource references, they will (unnecessarily) go through the FacesServlet as well.

IE9 sends for CSS files a Accept-Header of text/css while other browsers sends a Accept-Header of text/css;*/*. The FacesServlet itself is not supposed to respond on text/css requests.

There are basically 2 ways to fix this:

• Get rid of the /faces/* mapping and replace it by *.xhtml.

  <servlet-mapping>
      <servlet-name>Faces Servlet</servlet-name>
      <url-pattern>*.xhtml</url-pattern>
  </servlet-mapping>
  

• Use domain-relative URLs in <link> and <script> (and <img>) references so that they never go through the /faces path.

  <ui:param name="root" value="#{request.contextPath}/" />
  <link href="#{root}cv_website_styles.css" rel="stylesheet"  type="text/css" />
  <link rel="stylesheet" type="text/css" href="#{root}css/style.css"/>
  <script type="text/javascript" src="#{root}js/jquery.min.js"></script>
  <script type="text/javascript" src="#{root}js/script.js"></script>
  

  Or use the <base> tag, or use <h:outputStylesheet> and <h:outputScript> with a name instead.

Your site has by the way quite some 404's on several resources. Fix that as well. Check the "Net", "Network" section of the browser's builtin web developer toolset (press F12 in IE9/Chrome/Firebug).

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

---

Related Topics