Login/Register
How to prevent IE9 from rendering intranet sites in compatibility mode
Asked Answered
Solved internet-explorerinternet-explorer-9compatibility-modeie-compatibility-mode
M

4

26

IE9 has a weird problem where it renders intranet sites in compatibility mode.

Does anyone know a way how to prevent this from happening?

Note: I am not looking for a way to prevent it on a single users machine, but some programmatic way to prevent the site from ever rendering in compatibility mode.

Mimetic answered 15/10, 2012 at 10:52 Comment(0)
M
31

After an exhaustive search, I found out how to successfully prevent an intranet site from rendering in compatibility mode in IE9 on this blog:

From Tesmond's blog

There are 2 quirks in IE9 that can cause compatibility mode to remain in effect. The X-UA-Compatible meta element must be the first meta element in the head section. You cannot have condtional IE statements before the X-UA-Compatible meta element. This means that if you use Paul Irish's wonderful HTML5 Boilerplate then on an Intranet with default IE9 settings your website will display in compatibility mode. You need to change the start of the boilerplate from the following:-

<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

to:

<!doctype html>
<html class="no-js" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
Mimetic answered 16/10, 2012 at 8:40 Comment(4)
how thoroughly broken is that? I'm not sure that's so much a pair of 'quirks' as a pair of 'bugs'. :) Thanks for pointing me to the article. – Theine
I found a workaround for the IE7 rendering issue below, if you can live with Compatibility mode... – Brilliance
Thank you @novicePrgrmr! This doesn't prevent compatibility mode for me, but it renders the page in Internet Explorer 9 documents mode, which was what I needed. – Amative
This didn't work for me initially. But after some more reading I discovered that the X-UA-Compatible meta element not only has to be the first meta element in the head section, it should be the first element in the head section that does any sort of rendering. I had a link tag for my favicon ahead of it. Once I swapped them I had IE9 running in IE9 mode instead of IE7 compatiblity mode. – Kenleigh
B
4

Following from @novicePrgrmr's answer, there seems to be a workaround for IE9 loading Intranets in IE7-mode. While this still triggers compatibility mode, I found a slight modification to Paul Irish's HTML5 boilerplate markup at least allows IE9 to render Intranets in IE9 standards:

<!doctype html>
<html class="no-js" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
</head>
<!--[if lt IE 7]>   <body class="home lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>      <body class="home lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>      <body class="home lt-ie9"> <![endif]-->
<!--[if IE 9]>      <body class="home lt-ie10"><![endif]-->
<!--[if gt IE 9]><!--> <body class="home"> <!--<![endif]-->

    <p>content</p>

</body>
</html>

This is still valid HTML, and existing IE-specific CSS should still work just fine, provided you target IE using .lt-ie rather than html.lt-ie.

Brilliance answered 18/8, 2014 at 2:47 Comment(1)
yes this works, the secret is to have your conditional statements outside your head tag. – Besnard
N
3

This can be done by adding a simple meta tag

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

Another way to accomplish this is to add this code to your .htaccess file!

# ----------------------------------------------------------------------
# Better website experience for IE users
# ----------------------------------------------------------------------

# Force the latest IE version, in various cases when it may fall back to IE7 mode
#  github.com/rails/rails/commit/123eb25#commitcomment-118920
# Use ChromeFrame if it's installed for a better experience for the poor IE folk

<IfModule mod_headers.c>
  Header set X-UA-Compatible "IE=Edge,chrome=1"
  # mod_headers can't match by content-type, but we don't want to send this header on *everything*...
  <FilesMatch "\.(js|css|gif|png|jpe?g|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" >
    Header unset X-UA-Compatible
  </FilesMatch>
</IfModule>
Nimbus answered 15/10, 2012 at 10:59 Comment(3)
Just tried adding the meta tag. Did not fix the problem though and I don't have access to my htaccess file. Are you sure the meta tag will work for intranet sites? I know if will work for regular sites, but not sure about intranets. – Mimetic
Did you try clearing all your temporary internet files or even testing it on a other pc? – Nimbus
Yes, tested it on another PC actually. I researched a bit more, and I actually don't its possible to override the intranet compatibility mode in IE9. – Mimetic
J
1

If you can add code to the homepage, you can simply add this:

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

to your website's header.

(You can also use <meta http-equiv="X-UA-Compatible" content="IE=9"> to force IE9-Renderer) This will force IE9 to render in standard mode.

Another way is to use another doctype: Put this to the top of your code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Jordain answered 15/10, 2012 at 10:59 Comment(2)
Just tried both IE-edge and IE-9 methods. Neither worked. I need to place the meta tag in the <head> right? – Mimetic
Yeas, inside(below) the <head> tag. If it's not working, delete your doctype and replace it with: <!DOCTYPE html> – Jordain

© 2022 - 2024 — McMap. All rights reserved.