CSS Loading in IE9 but not IE11 using IE9 emulation mode - css

I have a really strange issue that has me pulling my hair out. When I load a web page in IE9 the CSS renders perfectly fine. The page also renders fine in firefox and chrome.
However when I try to render the page in IE11 using a document mode of 9 several CSS files are not being applied. This is also the case if the document mode is 10 but it works fine using "Edge"
I have monitored the network traffic and can confirm that the CSS files are being pulled down.
Any ideas what might be causing this?

Eventually during a discussion with a colleague it was discovered that this issue was being caused by SharePoint and not IE11. The problem was that the file was UTF-8 encoded and needed to be ANSI encoded and subsequently was not being served correctly for whatever reason.

For me the answer was to add this with my existing conditional comments...
<!--[if !IE]><!--><script type="text/javascript">if(/*#cc_on!#*/false){document.documentElement.className += 'ie10';}</script><!--<![endif]-->
Why it only works when I add that I'm not sure, currently using a HTML5 doctype and no additional styling is given with the class ie10, it's literally there for feature detection purposes only.
I had tried giving the CSS a different encoding (ANSI & UTF-8) like other answers have said, also tried using a XHTML 4.0 doctype incase it was caused by the HTML5 doctype but nope.
Also ensured the IIS 7.0 server did accept the text/css MIME.

Related

Chrome and firefox wont load css with the html 5 doctype

As soon as i place the into my script my page shows perfectly in IE but in firefox and chrome it doesn't load my css file at all.
But when i remove the doctype tag both firefox and chrome show the page perfectly!
And the weird thing is when i load the file locally it works fine with the doctype tag..
Is my host out of date or something?
"Solved"it with:
<!--[if IE]>
<!DOCTYPE html>
<![endif]-->
The solution you found yourself doesn't solve problems, it just puts a bandaid on it by not including a doctype for different browsers which isn't good practice.
You seem to have a lot of CSS errors and warnings, take a look at this link and work your way through them and maybe it will start working...
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.chatboxlive.com%2Fchat%2Findex2.php&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en
As for your HTML, you have duplicated some id names which is bad markup, take a look here and try either renaming them or changing it to a class as you can have many classes with the same name...
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.chatboxlive.com%2Fchat%2Findex2.php&charset=%28detect+automatically%29&doctype=Inline&group=0
A doctype is required in today's modern web pages. Without one, you are in quirks mode and, IE in particular, will struggle to present your page properly. You never want to be in quirks mode.
Remove your conditional comments and present that doctype to all browsers all the time on all web pages to remain in standards mode. Do NOT use IE as a reference for how things should work.
Write your markup as you think it should be done, validate it, then look to see if it works as you wish in all the browsers. You will have more problems with IE than the others but IE is most likely wrong.

my entire CSS dies in ie7 mode

It's bizarre.
This site works perfectly in all browsers but IE7. In ie7 NOTHING works. Most of the css just doesn't even render. IE8? Fine. Ie9 Perfect. Firefox and Chrome, of course.
Want to hear something weirder? this is a template site i have worked with before. Other sites built on essentially the same template DO work in ie7.
This is why i think whatever it is is simple.
I don't want to paste the code here - it's massive. But i'll give you a link to the site and to the css
site: http://canadianrecovery.ca
css http://canadianrecovery.ca/css/screen.css
Thing is, i have document standard set to ie9 It works fine in ie7 mode with doc standards set to ie9
But i have noticed that most IE browsers don't display default doc standards... this is obviously some sort of issue with IE itself. But it's frustrating.. most end users have no clue how to fix this.
Thanks in advance.
ella
I think I may have found the reason. In your body-style (line 13), you have the following:
font-family: "Times New Roman;
See that unclosed quote? Seems like Chrome, FF, IE9 etc can fix that error, whereas earlier versions of IE read the rest of the CSS as your font-family declaration.
Try Modernizr, it makes a lot of things possible in older/less compatible browsers without a lot of trouble. Try the development version to see if it can help you and compose your own production version targeting your specific needs to minimize the size (and speed) of the javascript library.
Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser.
Thanks everyone. I actually found a solution. Look for a js script called ie7.js and include it with conditional comments.. it solves a LOT of ie7 issues

Local testing WP theme in IE8 gives a strange layout?

Trying to test my theme on IE8 locally gives a bad result. But on the testing server it looks much better (not yet the same as FF or Chrome).
What do i need to do so my local IE8 behaves the same as IE8 on the server??
I am trying to get the full-screen background in IE8 to work with transparent div's
Bit clueless here.
regards
oh i use xampp for windows
Without a link or code, all I can say is be sure your code is W3C valid. Missing and out of place tags are leading causes of bad IE display in Wordpress. Use the W3C Validator either live at http://validator.w3.org/ or as a local standalone http://habilis.net/validator-sac/

Firefox not completeing stylesheet; works fine in Chrome and Safari

Firefox does not seem to be completing every aspect of the stylesheet for the site (nsfw text) www.theshandy.com
Firefox seems to have implemented the body styling but none of the class or id styles. Every other browser seems to be having no trouble at all.
After doing some research I have tried fixing problems other people have found. The sheet is directly linked (not called by php). The type is definitely text/css. And I believe it has the correct utf-8 character set.
I am really at a loss.
Thank you very much.
EDIT SOLVED:
It was a rogue apostrophe in one of the early ID styles. Apparently chrome and safari will ignore is and firefox won't and it then refused to load the rest of the stylesheet (creating the idea that the body styles were loading but not others.
Thank you for trying to help!
Check your paths.. you might be using /css/style.css instead of css/style.css.
This could generate this problem.

Cant force website not to render in IE7 in IE8

I have a webiste that is going into IE7 Mode in IE8 and I dont want it to be
I've tryed adding the meta tag to force it but IE just ignores it when on the server.
I've also tried adding it to the Web.config and the root Web.config of the server.
Can anyone help as the site does not render correctly under IE7 mode in IE8 and we use IE8
Adding meta tag or any other configuration change won't help you. Your markup is not adhering to XHTML standards and some other markup validation is also failing hence IE8 is triggering quirks mode and going to IE 7 mode. You need to fix your markup.
Try running your page through http://validator.w3.org/dev/tests/ and that should help you.

Resources