hena Posted September 11, 2015 Share Posted September 11, 2015 (edited) hi friends, i am asked to create a website which is compatible to chrome and IE 11. i am developing the site in html5 when i added meta tags <meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta http-equiv="X-UA-Compatible" content="chrome=1" /> its showing error in w3 html5 validator Error: A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge. From line 5, column 1; to line 5, column 56 =edge" />↩<meta http-equiv="X-UA-Compatible" content="chrome=1" /> ↩<met how to correct this Edited September 11, 2015 by hena Link to comment Share on other sites More sharing options...
dsonesuk Posted September 11, 2015 Share Posted September 11, 2015 X-UA-Compatible is only supported by the crappy of crap IE browsers, the other better browser don't require this being better browsers they are more future proof. So it only expects "IE=n" where 'n' equals the IE version you are targeting. Link to comment Share on other sites More sharing options...
hena Posted September 11, 2015 Author Share Posted September 11, 2015 X-UA-Compatible is only supported by the crappy of crap IE browsers, the other better browser don't require this being better browsers they are more future proof. So it only expects "IE=n" where 'n' equals the IE version you are targeting. so u are telling no need to keep the meta tag chrome=1 and instead of IE=edge, i should keep IE=11 ,is that so? Link to comment Share on other sites More sharing options...
Ingolme Posted September 11, 2015 Share Posted September 11, 2015 The only one you need is IE=Edge and it's just so that older versions of IE will behave more consistently with modern standards. Other browsers don't need this meta tag at all. Link to comment Share on other sites More sharing options...
dsonesuk Posted September 11, 2015 Share Posted September 11, 2015 Right! chrome-1 relates to IE using a chromeframe, but apparently its discontinued, IE=edge will attempt to use newest version of IE (11)but apparently that is unreliable as new versions of IE developed, so its being its normal crappy browser self. Link to comment Share on other sites More sharing options...
hena Posted September 12, 2015 Author Share Posted September 12, 2015 Right! chrome-1 relates to IE using a chromeframe, but apparently its discontinued, IE=edge will attempt to use newest version of IE (11)but apparently that is unreliable as new versions of IE developed, so its being its normal crappy browser self. I AM currently working on IE8, on chrome the code works fine but on IE menu and sub menu becoming ordered lists body { margin: 0; padding: 0; color: #fff; font-family: Arial; font-size: 14px; line-height: 1.5em; background-color: #ccc;}h2 { font-size: 26px; margin: 0 0 20px 0; padding: 0;line-height: 1.1em; color:rgb(255,221,0); }#header { clear:both; height:120px; background-image:url(images/86930033.JPG); }#site_title { float:left; margin: 25px 0 0 405px; }#site_title h2 { margin: 0; padding: 0; font-size:28px; color:#000;text-shadow:2px 2px #0093d0; }#menu { width:960px; position:relative; margin: 0px auto; background:#0093d0;}nav { position:relative;}nav ul { margin:0; padding:0;}nav ul li { margin:0; padding:0; list-style:none; display:inline-block; position:relative;}nav ul li a { font:bold 12px Arial; text-transform:uppercase; color:#fff; padding:7px 10px; display:inline-block; text-decoration:none;}nav ul li:hover > a { text-decoration:none; color:#fff; background:#ccc;}nav ul li a.current { background:#fff; color:#0093d0;}nav ul ul { min-width:200px; position:absolute; top:100%; z-index:666; background:#0093d0; display:none;}nav li:hover > ul { display:block;}nav ul ul li { display:block; width:100%;}nav ul ul a { padding:7px 10px; display:block; color:#fff; border-bottom:1px solid #ddd; text-align:left;}nav ul ul a:hover { background:#ccc;}nav ul ul a.current { background:#dddd; color:#0093d0;} #main { clear: both; width: 900px; margin: 0 auto; padding: 45px 30px 0; background-color: #54534a; overflow:hidden;} <html lang="en-US"><head><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta http-equiv="X-UA-Compatible" content="chrome=1" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="../index.css" rel="stylesheet" type="text/css" /><body> <div id="header"><!--starts of header--> <div id="site_title"> <h2>'IMPROVING HSE</h2> <img class="image_wrapper image_fr" src="../images/Logo_lockup.jpg" alt="image" /> <br><br><br> </div></div> <!-- end of header --><div id="menu"> <!--starts of menu--><nav><ul><li><a href="../index1.html">Home</a></li><li><a href="../a.html">a</a><ul><li><a href="../a1.html">a1</a></li><li><a href="a2.html">a2</a></li></ul></li><li><a href="../b.html" class="current">b</a><ul><li><a href="b1.html">b1/a></li><li><a href="b2.html">b2</a></li><li><a href="b3.html">b3</a></li></ul></li></ul></nav></div><!--end of menu--> Link to comment Share on other sites More sharing options...
dsonesuk Posted September 12, 2015 Share Posted September 12, 2015 You have to remember IE8 was 5 years behind all the better browsers, it did not support display: inline-block;, i think it only just begun to support :hover on elements other than the anchor element, it applied margins, padding, positioning differently, that is why IE was, is such a pain to work with.Also note it won't have any idea what new html5 elements are. Link to comment Share on other sites More sharing options...
hena Posted September 12, 2015 Author Share Posted September 12, 2015 You have to remember IE8 was 5 years behind all the better browsers, it did not support display: inline-block;, i think it only just begun to support :hover on elements other than the anchor element, it applied margins, padding, positioning differently, that is why IE was, is such a pain to work with.Also note it won't have any idea what new html5 elements are. when we give the site to the third party we dont know rite what browsers they are using .so how to make this website compatible with all browsers Link to comment Share on other sites More sharing options...
dsonesuk Posted September 12, 2015 Share Posted September 12, 2015 Make sure they understand tbey MUST use IE9 and above for HTML5.To use IE8 and above its probably better to use HTML 4 Strict doctype, with no html5 elements, float instead of inline block, make it so it works in the other better browsers, then spend next 2 weeks fixing problems hacking code so it works in IE 8 and above without the need to use javascript to work in HTML5, and yes! IE is that problematic, time wasting piece of s#
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now