How do I force Internet Explorer to render in Standards Mode and NOT in Quirks?

102,505

Solution 1

This is the way to be absolutely certain :

<!doctype html> <!-- html5 -->
<html lang="en"> <!-- lang="xx" is allowed, but NO xmlns="http://www.w3.org/1999/xhtml", lang:xml="", and so on -->
<head>
<meta http-equiv="x-ua-compatible" content="IE=Edge"/> 
<!-- as the **very** first line just after head-->
..
</head>

Reason :
Whenever IE meets anything that conflicts, it turns back to "IE 7 standards mode", ignoring the x-ua-compatible.

(I know this is an answer to a very old question, but I have struggled with this myself, and above scheme is the correct answer. It works all the way, everytime)

Solution 2

Sadly, they want us to use a tag to let their browser know what to do. Look at this documentation, it tell us to use:

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

and it should do.

Solution 3

  1. Using html5 doctype at the beginning of the page.

    <!DOCTYPE html>

  2. Force IE to use the latest render mode

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

  3. If your target browser is ie8, then check your compatible settings in IE8

I blog this in details

Solution 4

Adding the correct doctype declaration and avoiding the XML prolog should be enough to avoid quirks mode.

Solution 5

I know this question was asked over 2 years ago but no one has mentioned this yet.

The best method is to use a http header

Adding the meta tag to the head doesn't always work because IE might have determined the mode before it's read. The best way to make sure IE always uses standards mode is to use a custom http header.

Header:

name: X-UA-Compatible  
value: IE=edge

For example in a .NET application you could put this in the web.config file.

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-UA-Compatible" value="IE=edge" />
      </customHeaders>
    </httpProtocol>
</system.webServer>
Share:
102,505
maze
Author by

maze

Updated on July 05, 2022

Comments

  • maze
    maze almost 2 years

    I am coding a Frontend which works well in IE7 Standards Mode and IE8 Standards Mode.

    When I start up Internet Explorer and load the page both IE7 and IE8 go to Quirks Mode directly. How can I force both IE7 and IE8 to always load the page in Standards Mode?

    I have no special meta tags added so far.

    Thanks for helping me out

    Edit: My doctype and head looks as follows at the moment:

    <!DOCTYPE html> 
    <html lang="de"> 
    <head> 
        <title>...</title> 
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta charset="utf-8" />
        <script src="js/html5.js"></script> 
    
        (...)
    </head>
    
  • Admin
    Admin about 13 years
    This won't kick it out of quirks-mode or into quirks-mode but will only change the "emulation mode". IE6 can run in non-quirks mode (although that doesn't mean it isn't very quirky!).
  • Alfabravo
    Alfabravo about 13 years
    If should force the thing to load in standards mode.
  • Alfabravo
    Alfabravo about 13 years
    This is the right way to achieve the thing, must say. Somehow, one don't know with IE...
  • maze
    maze about 13 years
    This works for IE8. However, IE7 still goes to quirks mode first.
  • Alfabravo
    Alfabravo about 13 years
    IE7 is a real pain. Good to know that behavior you tell us, maze.
  • davidkonrad
    davidkonrad over 11 years
    @Sameer Alibhai, off course! It is so implied that I forgot it ;-) now corrected .
  • mjaggard
    mjaggard over 11 years
    This doesn't work with IE if you're running your web server on the local network :-(
  • mjaggard
    mjaggard over 11 years
    The HTML5 doctype was designed to put all browsers into standards mode.
  • mjaggard
    mjaggard over 11 years
    This is unfortunately not correct, a web server on the local network will still enable quirks mode when you have all this stuff. It's also IE=edge, not just Edge in the content of the meta tag.
  • davidkonrad
    davidkonrad over 11 years
    You are right about the IE=Edge, again, was written by hand :-( But you are NOT right, this is the solution. You have to decalre the x-ua-compatible as the very first line.
  • blu bla
    blu bla over 11 years
    @davidkonrad: so where does lang info and ie-specific classes go then? My html at the moment looks like this (example IE8): <html class="ie ie8 ie_old" lang="it-IT"> Sorry, cannot comment to last answer, don't have the necessary reputation yet...
  • Andreas Louv
    Andreas Louv almost 11 years
    @davidkonrad You are allowed to have a lang attribute on your html tag, and also have a compatible meta tag!
  • davidkonrad
    davidkonrad almost 11 years
    @NULL, The question here is not what there is allowed, but how you prevent IE to change its rendering modes. Those two issues is not nessecarily connected. It is allowed to have script, for instance, but if you have a script-tag before ..x-ua-compatible, IE doesnt follow the instruction. Sad you are downvoting this, because you are p**** off elsewere.
  • Andreas Louv
    Andreas Louv almost 11 years
    I downvote because of your comment: <!-- NO lang, NO xmlns="http://www.w3.org/1999/xhtml" and so on --> witch is clearly wrong. If you wan't to tell OP about removing xmlns it should be because it doesn't belong in html5.... Belong is a very fragile word to use but you can search google if you want to know more about it.
  • sam
    sam over 10 years
    Using a doctype + <html lang=en> shouldn't cause a problem.
  • davidkonrad
    davidkonrad over 10 years
    @sam, "should't" is a big word when it comes to IE :) I just inform what I finally figured out worked all the time in all modern IE's - 7, ,8 ,9 10, xx - on various windows-platforms, XP, vista, 7, 8, any combination of "modes"-settings and so on. It was very critical to me at that moment. Better safe than sorry. I know the official docs says, that <html lang="xx"> is completely legal, but I stick to my solution. It has never failed, and that lang tag is not nessecary anyway. So far none had complaint, but only upvoted - the only complains are those who stick to some rules in a doc.
  • sam
    sam over 10 years
    I understand but I meant that, AFAIK, lang or other html attributes won't make a difference to IE. :) I think doctype + x-ua-compatible is enough to make your example work.
  • psychowood
    psychowood about 10 years
    Not the best one, since MS states that "If both [meta and header] of these instructions are sent, the developer's preference (meta element) takes precedence over the web server setting (HTTP header)." msdn.microsoft.com/en-us/library/ff955275%28v=vs.85%29.aspx
  • Daniel Little
    Daniel Little about 10 years
    However you have to be careful because IE can decide the X-UA-Compatible value before reaching your Meta tag. That's why the header is still the best approach.
  • Kevin G.
    Kevin G. almost 9 years
    Had a problem just today with a Website being completely destroyed in IE9 for no obvious reasons. Removing all attributes from the html tag did the trick! Thank you a thousand times, was stuck for almost 2 hours already trying everything I could imaging!
  • Nah
    Nah almost 7 years
    This link to wikipedia quirks mode, saved my day. I was struggling with it last 2 days and really didn't know what is happening with me in IE. But I wonder that when I used to enforce my IE to Standard Mode it appears as Document Mode: IE7 standards. How can I enforce it to IE9 Standard