Forcing latest rendering engine in Internet Explorer

Internet Explorer and compatibility modes… I already posted about that topic earlier.

Yet, I recently began trying out Bootstrap (as you may have noticed if you keep an eye on Keyboard Playing’s homepage, or if you tried to have a look at the About or cyChop page which appear in the top menu) and discovered a new <meta /> tag in it. This was the right way to do it…

Replacing something dirty with something clean

Last time, I wrote (inspired from a French blog post) that to force IE, a sufficient way was to force a version number higher than any IE existing yet:

This works. Yet, there is a cleaner way to do this:

There are two interesting things:

  • IE=edge will force Internet Explorer to use the latest rendering engine available;
  • chrome=1 tells that if Google Chrome Frame is installed, it should be used to render the page.

Of the place of the tag in page [Update 2013-12-04]

When running a page through IE with the compatibility mode active, you can meet this warning:

This simply means IE already began rendering your HTML and cannot change the mode it chose. To prevent this, just remember: <meta/> tags should always be at the top of the <head/> section. No other tag before all <meta/> have been written.

Still getting better

Don’t want to add this header to all your pages? If you use a .htaccess file (or even better, if you have access to your Apache configuration file), you can set your server to send this instruction along with the HTTP headers (as I have done on Keyboard Playing, and should extend to the blog soon). It will then automatically apply to all the pages of your website.

Here is the code you would need to apply:

There, you’re all set!

(edit: a reader highlighted the fact that, as of IE11, IE has no longer ‘MSIE’ in its user agent, but is using ‘Trident’ instead)

IE8 and the compatibility mode

Well, working on a GWT/GXT application right now, and the latest challenge was to ensure compatibility in Internet Explorer 8. If most GWT components behave quite well in all browsers, GXT introduces some problems through permitting things IE cannot understand.

But once the GXT source code is correct, layout and CSS problems remain. Internet Explorer, or the nightmare of any web developer…

Yet, playing with the development tools and available compatibility modes, I found out that IE7’s compatibility mode introduces problems which are ruled out through using IE8’s engine. So, the only thing left to do was to forbid IE8 to use the compatibility mode, so that users do not have to tinker with settings the way I did.

Specify the compatibility mode in IE8

Quite simple actually. IE does not use comments this time, but a real <meta /> tag. I still find it ugly, but it is better nonetheless.

So, for people who must force Internet Explorer to behave like an older version, you just have to insert this tag inside your <head>:

Forbidding compatibility mode in IE8

That is all fair and well, but for those who remember, I aimed exactly at the contrary: not forcing the compatibility mode but preventing it instead.

Well, this actually is just as easy:

Forcing the compatibility mode to the latest version

This tip can be used to make Internet Explorer use the latest known version, and thus anticipate future versions of the browser. It looks quite like the precedent:

And in IE9+?

I actually have no idea, as my own concerns were with IE8 (for now).

Logically, the forcing the compatibility mode should work as long as the browser include this compatibility. As for forbidding it, the second tip is quite clear.

If you have any tip about compatibility mode in IE, just share it with us!

(inspired from a French post: