Search code examples
htmlasp.netinternet-explorercompatibility

IE9 sometimes switching to Document Mode: IE7 Standards


I imagine that this might be a quick and easy question for someone who's more familiar with IE browser modes.

We have an intranet application window that's sometimes switching to 'Document Mode: IE7 Standards' (w/ Browser Mode: IE9) per the dev tools -- really relatively rarely, so it's hard to tell exactly what leads up to the issue. The result is that the form fields are all jumbled, the CSS/floats are skewed, the scripts don't work right, etc. Once the problem occurs, the only way to solve it is to completely close the browser and restart Internet Explorer.

We finally found a user while they were experiencing the glitch, opened dev tools, and confirmed that the document mode had set itself to IE7 and changing that back to IE9 fixed everything. But still, once it has set itself to IE7, the only way to default it back to IE9 is to close out of the browser. Otherwise, if you just close the window but not the whole browser, it's back to IE7 each time you open the window.

I don't know what could be causing this issue so intermittently. I thought it could be something to do with the Doctype? Can anybody offer any advice?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AppScreen.aspx.cs" Inherits="Project.AppScreen" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <link href="~/Styles/AppScreen.css" rel="Stylesheet" type="text/css" />
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <title>Title</title>

    <script type="text/javascript">
    //A couple other quickie scripts
    </script>
</head>

Solution

  • You say you want to find out the root of the problem, so here goes:

    IE has a config setting which specifies to use compatibility mode for sites on the local intranet. This config setting defaults to being switched on.

    This setting exists for the purpose of assisting corporates who are upgrading their IE version but don't want to upgrade their intranet software.

    The problem of course is that many intranets don't fall into this category; you want IE to use its best mode even on your intranet. But the setting had to have a default one way or the other, and Microsoft chose to default it to on.

    So your solution is to go round the PCs on your intranet and turn the setting off. (some users may have already switched it off themselves, or had it set that way by their installation, which would explain why it doesn't happen for everyone).

    Alternatively, you can put the meta tag to force IE to use your preferred mode:

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

    Here, IE=edge tells IE to use its best available mode, rather than fixing it to a specific IE version.

    To be honest, it's a good idea to put this meta tag into your code anyway, to avoid any random issues with remaining users who might have set IE to the wrong mode somehow.

    You can also specify the X-UA-Compatible flag as a http header if you don't want it cluttering up your HTML code.

    Finally, veering slightly off topic, but It's worth noting also that the definition of "local intranet" also includes any sites running on your own PC. This means that this setting often catches out novice web developers who are working on localhost but don't know about the setting.