X-UA-Compatible and HTML5
When Microsoft released IE8, they added a way of ensuring which rendering mode the browser uses. You do it by setting a non-standard header, either with a
meta element in your HTML or by configuring your web server to send the header as part of the HTTP response. A lot more details can be found in Defining Document Compatibility (that URL looks far from stable, so don’t be surprised if it doesn’t work).
Always making sure to use a doctype that triggers full standards mode I’ve never encountered a need to use this myself, but I encountered it recently on a couple of sites. What I noticed was that using the following
meta element to set the compatibility header will cause a validation error (Bad value “X-UA-Compatible” for attribute “http-equiv” on element “meta”) in HTML5:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Of course you can do what the “cool” kids do nowadays and simply ignore the error, but I suggest doing things the right way instead. Get the
meta element out of your markup and and send the header over HTTP instead.
On Apache, add this to your root .htaccess file:
Header set X-UA-Compatible "IE=edge"
You can set it in other ways too. The mod_headers documentation has the info you need. If you have to use IIS, Implementing the META Switch on IIS may be what you need.
But before doing any of the above, consider whether you really need that header at all.
- Previous post: The CSS3 Flexible Box Layout (flexbox)
- Next post: Controlling width with CSS3 box-sizing