Menu
I'm using the excellent HTML 5 Reset template at html5reset.org and my X-UA-Compatible meta tag doesn't seem to work. Here is what my header looks like:
<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie ieNoHtml5 ie6 no-js" lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="ie ieNoHtml5 ie7 no-js" lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="ie ieNoHtml5 ie8 no-js" lang="en"> <![endif]-->
<!--[if IE 9 ]> <html class="ie ie9 no-js" lang="en"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
<!-- the "no-js" class is for Modernizr. -->
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Title of Page</title>
The option to use compatibility view mode in IE is displayed (broken page icon in URL field). The problem is that some of my clients have set their IE9 browsers into 'always use compatibility view' mode, the result being that the website looks like IE7 even though they're using IE9, and X-UA-Compatible is suppose to override this.
Now if I remove the funny header stuff:
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
...it suddenly starts working fine.
I've noticed that html5reset.org itself seems to display the broken page icon, so it doesn't seem to work either, but html5boilerplate.com DOES work, and seems to use the same approach.
Adding the X-UA-Compatible into the response header via webserver config seems to fix it, but I'd rather not rely on this approach.
Update: It seems that html5boilerplate.com is just sending X-UA-Compatible in the HTTP response headers if it detects that the browser is IE. This seems the way to go.
457
HTML5 Boilerplate recommends the webserver config. It's faster and solves a few edge cases that the markup solution doesn't work with: https://github.com/h5bp/html5-boilerplate/blob/v4.0.0/doc/html.md#x-ua-compatible
120
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
