Menu
I cannot disable the IE Compatibility mode button in IE9.
My head and doctype look like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--[if lte IE 8]>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-en" xml:lang="en-en" class="ie8">
<![endif]-->
<!--[if IE 9]>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-en" xml:lang="en-en" class="ie9">
<![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-en" xml:lang="en-en">
<!--<![endif]-->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="description" content="meta content here" />
</head>
<body>
<!-- page content here //-->
</body>
</html>
How do I disable the compatibility mode button in IE9?
I thought I did my research. I applied every kind of fallback solution to display everything fine in every IE from 7 to 9 and up.
The client is complaining about the compatibility mode that when activated, it messes up the layout. Is there any way to disable that button?
940
Turn off compatibility modeIn the Properties window, click the Compatibility tab. Under the Compatibility mode section, uncheck the box for the Run this program in compatibility mode for option. Click the OK button to save these settings.
Click Tools in the browser menu bar, and then click Compatibility View settings. Clear the Display intranet sites in Compatibility View check box, and the click Close.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
Chrome frame has been discontinued by Google as of Jan 2014 so the chrome=1 part is not required
<meta http-equiv="X-UA-Compatible" content="IE=edge">
The "edge" forces standards mode (or latest rendering engine) in IE and the "chrome" is for Chrome Frame.
Further info available here:
86
I was using conditional comments at the top of the page to embed an ie class based on version. (eg:)
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
As a result, even though I was setting the X-UA-Compatible meta tag, the Compatability Mode button was still being shown in IE.
To fix, I had to move the conditional comments to the bottom of the page and use JS to apply the ie classes. The Compatibility button is no longer shown in IE when viewing my site.
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8; IE=9; IE=10; IE=EDGE; chrome=1">
<head>
<body>
<!-- ..Other content... -->
<script type="text/javascript">
window.flagAsIE = function(version) {
var cls = document.body.parentElement.getAttribute('class');
document.body.parentElement.setAttribute('class', "ie ie" + version + " " + cls);
};
</script>
<!--[if lt IE 7 ]><script type='text/javascript'>flagAsIE('6');</script><![endif]-->
<!--[if IE 7 ]><script type='text/javascript'>flagAsIE('7');</script><![endif]-->
</body>
</html>
Here's the answer:
http://blogs.msdn.com/b/jonbox/archive/2011/03/27/removing-the-ie9-compatibility-button-and-html1115-warning.aspx
Change the order of your meta tags.
29
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
