IE Compatibility Mode: 'X-UA-Compatible' tag 'Edge'
HtmlInternet ExplorerCross BrowserX Ua-CompatibleHtml Problem Overview
I have this in the <head>:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
It will force the latest rendering mode for IE, but is Compatibility Mode considered the last one?
I mean, for example: using this code with IE8, it will force it to use IE8 or IE8 Compatibility Mode?
Html Solutions
Solution 1 - Html
That tag will try to force the browser to use the latest rendering mode the browser supports. It will not trigger Compatibility mode.
Note that the tag has to be the first tag in the head or it will not work. This fact favors using HTTP headers if possible as the order in the HTTP headers does not matter.
If the browser stills ends up in Compatibility mode when you use a header or the meta tag one of these things is likely the cause:
- you are missing a sane doctype
- the browser has been set to always use compatibility mode
- the site is hosted on an "intranet site" and the default setting for intranet sites is set
Changing the browsers Compatibility View settings
Microsoft considers at least 192.168.x.x to be on a "Intranet site". The default for intranet sites in IE8/IE9 is to use compatibility mode. That's a huge issue for many business applications as the programmer CANNOT override this option even with this meta tag. ("Display intranet sites in Compatitiblity View" is not overridable by meta tag or http header - the browser is in complete control of compatibility view in this case)
Always add this meta tag or an http header?
One more good thing about using this meta tag is that the "compatibilty view" icon is removed from the address bar of the browser. At least your users can then not decide the render mode using that button.
Solution 2 - Html
Even if you have unchecked the "Display intranet sites in Compatibility View" option, and have the X-UA-Compatible in your response headers, there is another reason why your browser might default to "Compatibility View" anyways - your Group Policy. Look at your console for the following message:
> HTML1203: xxx.xxx has been configured to run in Compatibility View through Group Policy.
Where xxx.xxx is the domain for your site (i.e. test.com). If you see this then the group policy for your domain is set so that any site ending in test.com will automatically render in Compatibility mode regardless of doctype, headers, etc.
For more information, please see the following link (explains the html codes): http://msdn.microsoft.com/en-us/library/ie/hh180764(v=vs.85).aspx
Solution 3 - Html
I'm not an expert but by trial and error:
<meta http-equiv="X-UA-Compatible" content="IE=8, IE=9, IE=edge"/>
solved the problem for me. I used this on websites and webapps and it stopped IE8 from going into compatibility mode, and displayed as 'standard' in IE10 and IE11.
Solution 4 - Html
What is the point of using the Edge keyword alone? I mean, if you want IE to use the most recent rendering engine, then just drop the whole meta tag.
Otherwise, it should look something like that (that would make IE8 behave like IE7 and IE9 and newer will work as usual) :
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7, IE=Edge" />