Login/Register
How to disable Compatibility View in IE
Asked Answered
Solved internet-explorerinternet-explorer-8internet-explorer-9x-ua-compatibleie-compatibility-mode
A

8

77

I am wondering how do you stop people who are using IE 8 from going to Compatibility mode?

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

I found this tag and I think this forces people to stay in IE-8 mode but I am not too sure and can't check as I have IE 9.

If people are in IE 9 mode I force them to not go into IE 8 or IE 7 Compatibility mode?

I tried to put the above line in my code and went to IE 9 -> Tools -> Compatibility View(Grayed Out)

but "Compatibility View Settings" was not grayed out and it seems you could add the site through there.

So should that not disable?

Adamsun answered 14/6, 2011 at 19:29 Comment(1)
@Sparky672 - yes I do. I don't support IE 7 and display a browser is out of date warning. What I found through usability studies most people do not release that they might be in compatibility mode(and have actually no knowledge of them setting it on) and when you tell them their browser is out of date and they think they are using IE 8(latest browser at the time of the study) they get confused very fast. Best solution is to force them back to IE 8/9(to what they probably think they are running anyways) – Adamsun
S
50
<meta http-equiv="X-UA-Compatible" content="IE=8" />

should force your page to render in IE8 standards. The user may add the site to compatibility list but this tag will take precedence.

A quick way to check would be to load the page and type the following the address bar : 

javascript:alert(navigator.userAgent)

If you see IE7 in the string, it is loading in compatibility mode, otherwise not.

Stolid answered 15/6, 2011 at 3:25 Comment(8)
What happens if their using IE 9 will this set them to IE 8? – Adamsun
If user is using it in IE9 it will display it in IE8 standards mode. You can also use the F12 Developer Toolbar in IE9 to verify it. – Stolid
Better use <meta http-equiv="X-UA-Compatible" content="IE=edge" /> Also if the site is hosted on what Microsoft considers to be "Intranet" you're screwed, it will still display in Compatibility View. Only way to override that is to uncheck "Display Intranet sites in Compatibility View" checkbox in Tools - Compatibility View settings. That default setting in IE8+ really stinks. – Hadrian
I second that. Just got bit by the "Display Intranet sites in Compatibility View" default setting (in IE9 in my case). – Aggrade
I have the "Display Intranet Sites in Compatibility View" checked, but the X-UA-Compatible meta tag seems to be overriding it. – Buprestid
@SrirangaChidambara: I have the meta statement after the <head> before other tags, I hit F12, but IE9 developer toolbar still says "IE9" mode, not IE8. IE10 still says IE10, not IE8. – Aneurysm
To get to "Display Intranet sites in Compatibility View", press ALT, Tools. Spent a while banging my head clicking tools in DevTools – Calvano
@JustinSkiles did you ever figure out why your meta tag was able to override your Display Intranet Sites in Compatibility View settings? It seems for some people this works, but for others like me, I must manually go in and uncheck that IE setting regardless of whether I include the meta tag. – Heiner
R
91

All you need is to force disable C.M. in IE - Just paste This code (in IE9 and under c.m. will be disabled):

<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />

Source: http://twigstechtips.blogspot.com/2010/03/css-ie8-meta-tag-to-disable.html

Reverberator answered 28/4, 2012 at 17:18 Comment(3)
This saved me with Twitter Bootstrap & IE Compatibility. FYI - This needs to be the FIRST meta tag. – Robey
Isn't this the same as <meta http-equiv="X-UA-Compatible" content="IE=edge" /> ? – Suiting
take care not to use any conditional comments before this tag. Otherwise it's not working! Found the hint there: #3449786 – Disorient
V
74

This should be enough to force an IE user to drop compatibility mode in any IE version:

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

However, there are a couple of caveats one should be aware of:

  • The meta tag above should be included as the very first tag under <head>. Only the <title> tag may be placed above it.

If you don't do that, you'll get an error on IE9 Dev Tools: X-UA-Compatible META tag ignored because document mode is already finalized.

  • If you want this markup to validate, make sure you remember to close the meta tag with a /> instead of just >.

  • Starting with IE11, edge mode is the preferred document mode. To support/enable that, use the HTML5 document type declaration <!doctype html>.

  • If you need to support webfonts on IE7, make sure you use <!DOCTYPE html>. I've tested it and found that rendering webfonts on IE7 got pretty unreliable when using <!doctype html>.

The use of Google Chrome Frame is popular, but unfortunately it's going to be dropped sometime this month, Jan. 2014.

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

Extensive related info here. The tip on using it as the first meta tag is on a previously mentioned source here, which has been updated.

Vivle answered 14/1, 2014 at 14:15 Comment(1)
I don't see "X-UA-Compatible META tag ignored" message, but it uses IE7 mode. When I moved this tag up - most of the time it uses IE11, but sometimes still IE7. – Marandamarasca
S
50
<meta http-equiv="X-UA-Compatible" content="IE=8" />

should force your page to render in IE8 standards. The user may add the site to compatibility list but this tag will take precedence.

A quick way to check would be to load the page and type the following the address bar : 

javascript:alert(navigator.userAgent)

If you see IE7 in the string, it is loading in compatibility mode, otherwise not.

Stolid answered 15/6, 2011 at 3:25 Comment(8)
What happens if their using IE 9 will this set them to IE 8? – Adamsun
If user is using it in IE9 it will display it in IE8 standards mode. You can also use the F12 Developer Toolbar in IE9 to verify it. – Stolid
Better use <meta http-equiv="X-UA-Compatible" content="IE=edge" /> Also if the site is hosted on what Microsoft considers to be "Intranet" you're screwed, it will still display in Compatibility View. Only way to override that is to uncheck "Display Intranet sites in Compatibility View" checkbox in Tools - Compatibility View settings. That default setting in IE8+ really stinks. – Hadrian
I second that. Just got bit by the "Display Intranet sites in Compatibility View" default setting (in IE9 in my case). – Aggrade
I have the "Display Intranet Sites in Compatibility View" checked, but the X-UA-Compatible meta tag seems to be overriding it. – Buprestid
@SrirangaChidambara: I have the meta statement after the <head> before other tags, I hit F12, but IE9 developer toolbar still says "IE9" mode, not IE8. IE10 still says IE10, not IE8. – Aneurysm
To get to "Display Intranet sites in Compatibility View", press ALT, Tools. Spent a while banging my head clicking tools in DevTools – Calvano
@JustinSkiles did you ever figure out why your meta tag was able to override your Display Intranet Sites in Compatibility View settings? It seems for some people this works, but for others like me, I must manually go in and uncheck that IE setting regardless of whether I include the meta tag. – Heiner
W
9

If you're using ASP.NET MVC, I found Response.AddHeader("X-UA-Compatible", "IE=edge,chrome=1") in a code block in _Layout to work quite well:

@Code
    Response.AddHeader("X-UA-Compatible", "IE=edge,chrome=1")
End Code
<!DOCTYPE html>
everything else
Walsingham answered 19/12, 2012 at 15:9 Comment(0)
A
5

The answer given by FelixFett worked for me. To reiterate:

<meta http-equiv="X-UA-Compatible" content="IE=11; IE=10; IE=9; IE=8; IE=7; IE=EDGE" />

I have it as the first 'meta' tag in my code. I added 10 and 11 as those are versions that are published now for Internet Explorer.

I would've just commented on his answer but I do not have a high enough reputation...

Ancylostomiasis answered 17/11, 2014 at 19:37 Comment(0)
K
3

Another way to achieve this in Apache is by putting the following lines in .htaccess in the root folder of your website (or in Apache's config files).

BrowserMatch "MSIE" isIE
BrowserMatch "Trident" isIE
Header set X-UA-Compatible "IE=edge" env=isIE

This requires that you have the mod_headers and mod_setenvif modules enabled.

The extra HTTP header only gets sent to IE browsers, and none of the others.

Kelpie answered 18/7, 2014 at 10:26 Comment(0)
R
1

In JSF I used:

<h:head>
    <f:facet name="first">
        <meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
    </f:facet>

    <!-- ... other meta tags ... -->

</h:head>
Recommit answered 4/7, 2014 at 13:22 Comment(0)
L
0

Adding a tag to your page will not control the UI in the Internet Control Panel (the dialog that appears when you selection Tools -> Options). If you're looking at your homepage which could be google.com, msn.com, about:blank or example.com, the Internet Control Panel has no way of knowing what the contents of your page may be, and it will not download it in the background.

Have a look at this document on MSDN which discussed compatibility mode and how to turn it off for your site.

Larrylars answered 14/6, 2011 at 19:45 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.