1

I have recently updated the following website which works properly in Firefox, Safari, and Chrome (all that I've tested so far) but does not work in Internet Explorer. I've searched all the similar articles both here and around the web, but have not been able to find a solution that works.

I have validate my CSS (only have some warnings, but no Errors) and my HTML which has some errors but none of which are related to the fact that my website will not display at all in Internet explorer 8, 9 or 10 which is 75% of my audience. Please advice with any help or suggestions.

Thanks!

Website Link

Update:

I've fixed the missing "-->" from my style. (Thanks Carl Markham!)

I've updated the Meta tag to be the following and also set the charset to utf-8:

<meta http-equiv="X-UA-Compatible", content="IE=edge,chrome=1">

I still cannot get the page to load in IE8 or IE9.

Final Update:

I wanted to update everyone on the solution that finally fixed the issue(s) that I was having. As it turns out there was some back-end code that was written for identifying specific ie versions and displaying a warning for those older than ie10 and in their code they had somehow disabled displaying the site rather than displaying a warning.

Along with their code being removed suggestions made by @Pointy @Carl Markham helped it display much closer to how I anticipated once it was able to load in ie8 / ie9. Thank you all very much for the help!

AD_Ben
  • 45
  • 3
  • 8

5 Answers5

3

Remove this meta tag from the head of the document:

<meta http-equiv="X-UA-Compatible" content="IE=8">

Also, since I'm getting an error in IE (error 80020101) make all your javascript comments in the following form, based on this answer:

/*Comment*/

and not:

//Comment
Community
  • 1
  • 1
otinanai
  • 3,987
  • 3
  • 25
  • 43
  • `//` style comments work perfectly well in JavaScript in all browsers. – Pointy Jan 20 '14 at 20:56
  • I was getting error 80020101 in IE console and a quick search suggests this solution, which strangely(!) works. – otinanai Jan 20 '14 at 20:57
  • 1
    Not everything on the Internet is correct :) C++ style `//` comments don't cause Ajax errors. – Pointy Jan 20 '14 at 20:58
  • @otinanai I've tried removing the meta tag without it making any difference before. – AD_Ben Jan 21 '14 at 14:42
  • @BigBen Try to resolve all javascript and doctype issues and it will work. The issues I'm having are: HTML1524: Invalid HTML5 DOCTYPE. Consider using the interoperable form " ". File: www.accentdecor.com, Line: 1, Column: 1 HTML1402: Character reference is missing an ending semicolon ";". File: www.accentdecor.com, Line: 569, Column: 24 HTML1402: Character reference is missing an ending semicolon ";". File: www.accentdecor.com, Line: 586, Column: 24 HTML1402: Character reference is missing an ending semicolon ";". File: www.accentdecor.com, Line: 587, Column: 24 – otinanai Jan 21 '14 at 14:48
  • @otinanai I've changed the doctype back to the interoperable form as suggested as well as I've cleared a lot of the other errors (not 100% clean yet, but none of the errors remaining should produce the issue I'm seeing (or rather not seeing) with ie8 / ie9. – AD_Ben Jan 21 '14 at 19:58
  • @BigBen you need to go step by step here so that you can identify the error. First, take out all javascript inside `` tag and see if it's working now. – otinanai Jan 21 '14 at 20:05
  • @otinanai I've removed the javascript inside the tag and retested, but it didn't make any difference (I've put it back in since it didn't make a difference) – AD_Ben Jan 23 '14 at 11:54
2

Better yet, instead of removing this:

<meta http-equiv="X-UA-Compatible" content="IE=8"> 

you can alter it so that you request that the version of IE that loads your page runs at it's "natural" personality:

<meta http-equiv="X-UA-Compatible", content="IE=edge,chrome=1">

You should put that tag right at the very top of the <head>, before anything other than <title> and definitely before any other <meta> tags.

Alternatively, you can set the "X-UA-Compatible" property in the response headers; that's really the best way to do it.

Pointy
  • 405,095
  • 59
  • 585
  • 614
  • I've tried both removing the meta tag and altering it as you recommended, however I'm still not able to get the page to load in IE8 or IE9 (which I'm testing using Broswerling and Broswerstack) – AD_Ben Jan 21 '14 at 12:33
  • @BigBen well it helps a lot to have a *real* IE browser to mess with; can you even get to developer tools via those things? IE tells you what document mode it's operating under that way. The most solid way to deal with this is to make sure that your server is setting the "X-UA-Compatible" header in the HTTP response. (You can also do the meta tag.) – Pointy Jan 21 '14 at 13:21
  • I dusted off and hooked up an old PC running IE8 and I am getting the same non-response as I get when I tested with the two aforementioned testing sites. (on a side note you can access developer tools with BroswerStack). – AD_Ben Jan 21 '14 at 14:41
  • @BigBen so the page simply doesn't load *at all*? No errors anywhere? You can't even see the DOM via the developer console? – Pointy Jan 21 '14 at 14:53
  • @BigBen your server is already setting the Content-Type header, so you don't need that `` tag. Note that in my answer I stipulated that the "X-UA-Compatible" tag has to appear before any other `` tag. – Pointy Jan 21 '14 at 14:56
  • @BigBen You server is simply returning nothing when IE8 issues an HTTP request. It's getting back 204 (No Content) HTTP response. – Pointy Jan 21 '14 at 15:15
  • sorry for missing the "before any other tags" portion of your response. I've removed the content-type meta tag so the only one I have on there currently is the x-ua-compatible portion. I've tried with and without this meta tag and I am still getting back 204. any other ideas? – AD_Ben Jan 21 '14 at 17:57
  • @BigBen the 204 error has nothing to do with what's in the page - it's something your web server is doing. – Pointy Jan 21 '14 at 19:54
  • thanks! I've contacted my webserver admin to have him take a look it. I appreciate your help and once the problem is solved I'll make the answer. thank you again for your help and putting up with my noob brain. – AD_Ben Jan 21 '14 at 20:02
1

Remove the <meta> tag from the <head>. This is causing the issue!

<meta http-equiv="X-UA-Compatible" content="IE=8"> 
Praveen Kumar Purushothaman
  • 164,888
  • 24
  • 203
  • 252
1

You are missing the closing --> From your style in the head. removing that helped me to render it in IE

Cjmarkham
  • 9,484
  • 5
  • 48
  • 81
  • Thanks for this oversight Carl. It helped it render properly in IE10 but didn't solve the issue of earlier versions of IE – AD_Ben Jan 21 '14 at 12:23
0

You've to remove this:

<meta http-equiv="X-UA-Compatible" content="IE=8">

Perhaps this will help if you have other problems: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.accentdecor.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Probably switch to utf-8 as charset. This is the standard for websites wordlwide.

Praveen Kumar Purushothaman
  • 164,888
  • 24
  • 203
  • 252
ArjanSchouten
  • 1,360
  • 9
  • 23