How to force quirks mode in IE7 (while keeping to standards mode in IE8+)

If you put an HTML comment above the doctype declaration, it causes IE7 to enter quirks mode, but not any other browsers.

<!-- This forces quirks mode in IE7 only -->
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <title>Quirks mode in IE7!</title>
  </head>
  <body></body>
</html>

Wow! That’s neat, I guess?

Why would anyone want to do this? Well, I had an application that required the IE6 box model for some pieces (so we could have 100% width input elements (with padding) inside dynamically sized table columns (with padding)). Forcing IE7 into quirks mode causes it to follow the IE6 box model, but I wanted to keep IE8+ in standards mode since you can use the box-sizing CSS property to achieve the correct box model in more modern browsers.

So, you see, there’s at least one use case.

3 thoughts on “How to force quirks mode in IE7 (while keeping to standards mode in IE8+)

  1. Thanks Willem, I had forgotten to include the `< meta http-equiv="X-UA-Compatible" content="IE=Edge" >` tag which should make it work as expected in IE9 as well. I added it into the post.

Leave a Reply

Your email address will not be published. Required fields are marked *