Document compatibility is an important concern for Web
developers. Windows Internet Explorer 8 introduces document compatibility modes
that allow Web developers to tell the browser to render their pages in the same
way as older versions would, thereby allowing the developer to choose when to
update.
This document describes the document compatibility modes
supported by Internet Explorer 8 and explains how they may be implemented on a
per-page or per-site basis by using custom headers. By implementing the
appropriate compatibility mode, a site can ensure compatibility with Internet
Explorer 8 and beyond.
Different Compatibility Modes
Internet Explorer 8 supports many compatibility modes that
enable different supported features and affect the manner in which content is
rendered. For example,
IE5 mode renders content as if it were displayed by the
Windows Internet Explorer 7 Quirks mode, which is very similar to how Microsoft
Internet Explorer 5 displayed content.
IE7 mode renders content as if it were displayed by the
Internet Explorer 7 Standards mode, whether or not the page contains a
<!DOCTYPE> directive.
EmulateIE7 mode tells Windows Internet Explorer to use the
<!DOCTYPE> directive to determine how to render content. Standards mode
directives are displayed in Internet Explorer 7 Standards mode, and Quirks mode
directives are displayed in IE5 mode. Unlike IE7 mode, EmulateIE7 mode respects
the <!DOCTYPE> directive. For many Web sites, this is the preferred
compatibility mode.
EmulateIE8 mode is similar to EmulateIE7 mode; Internet
Explorer uses the <!DOCTYPE> directive to determine how to render content;
however, standards mode directives are displayed in Internet Explorer 8
Standards mode. Quirks mode directives are displayed in IE5 mode.
IE8 mode provides the highest support available for industry
standards, including the W3C Cascading
Style Sheets Level 2.1 Specification and the W3C Selectors API, as well as limited
support for the W3C Cascading
Style Sheets Level 3 Specification (Working Draft).
Edge mode tells Windows Internet Explorer to display content
in the highest mode available, which actually breaks the “lock-in” paradigm.
With Internet Explorer 8, this is equivalent to IE8 mode. If a (hypothetical)
future release of Internet Explorer supported a higher compatibility mode,
pages set to Edge mode would appear in the highest mode supported by that
version; however, those same pages would still appear in IE8 mode when viewed
with Internet Explorer 8. It is recommended that Web developers restrict their
use of Edge mode to test pages and other non-production uses because of the
possible unexpected results of rendering page content in future versions of
Windows Internet Explorer.
By default, Internet Explorer 8 uses EmulateIE8 mode to
display pages loaded from the Internet Zone. Web pages loaded from the Intranet
Zone or with the Web Browser control are displayed in EmulateIE7 mode. These
defaults can be changed
Specifying Compatibility Modes on a Per-Page Basis
To specify a document mode for your Web pages, use the META
element to include an X-UA-Compatible http-equiv
header in your Web page. The following example specifies EmulateIE7 mode
compatibility.
<html>
<head>
<!-- Mimic Internet Explorer 7 -->
<title>My Web Page</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
</head>
<body>
<p>Content goes here.</p>
</body>
</html>
The content attribute specifies the mode for the page; for
example, to mimic Internet Explorer 7 behavior, specify IE=EmulateIE7.
Likewise, specify IE=5, IE=7, or IE=8 to select one of those compatibility
modes. You can also specify IE=edge to tell Internet Explorer 8 to use the
highest mode available.
The X-UA-compatible header is not case sensitive; however,
it must appear in the Web page's header (the HEAD
section) before all other elements, except for the TITLE element and other
META elements.
Specifying Compatibility Modes on a Per-Site Basis
A document mode can be specified for your Web site by
defining a custom HTTP response header for the site using your Web server. An
HTTP response header is the information a Web server attaches to the file it
sends to your browser in response to the HTTP request and that usually contains
information such as date, size, and type of file that is being sent back.
The following documents describe the steps required to
configure your Web server to attach a custom HTTP response header to all of
your Web pages. This will cause Internet Explorer 8 to use a specific document
compatibility mode, such as EmulateIE7.
If you specify a default document compatibility mode using
your Web server, you can override that setting by specifying a different
document compatibility mode in a specific Web page. The mode specified within the
Web page takes precedence over the mode specified by the server.
Determining Document Compatibility Mode Using Script
To determine the document compatibility mode of a Web page
using Internet Explorer 8, use the documentMode
property of the document
object. For example, typing the following into the Internet Explorer 8 Address
bar displays the document mode for the current Web page.
javascript:alert(document.documentMode);
The documentMode property returns a numeric value,
corresponding to the page's document compatibility mode. For example, if a page
has chosen to support IE8 mode, documentMode returns the value 8.
Note: The compatMode
property introduced in Windows Internet Explorer 6 has been deprecated in favor
of the documentMode property introduced in Internet Explorer 8. Applications
that currently rely on compatMode will continue to work in Internet Explorer 8;
however, they should be updated to use documentMode.
If you wish to use JavaScript to determine a document's
compatibility mode, include code that supports older versions of Windows
Internet Explorer, as shown in the following example.
engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
// This is an IE browser. What mode is the engine in?
if (document.documentMode) // IE8
engine = document.documentMode;
else // IE 5-7
{
engine = 5; // Assume quirks mode unless proven otherwise.
if (document.compatMode)
{
if (document.compatMode == "CSS1Compat")
engine = 7; // standards mode
}
}
// The engine variable now contains the document compatibility mode.
}
The document object used here represents the HTML document
in a given browser window and can be used to examine, modify, or add content to
an HTML document and to process events within that document.
Determine Document Compatibility Mode Using Conditional Comments
If only targeting Internet Explorer, the following code
example illustrates how to use conditional comments to target current or legacy
versions.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
<head>
<title>Test Page</title>
<meta http-equiv="X-UA-Compatible" content="IE=8"/>
<!--[if gte IE 8]>
<style type="text/css">
body {
color: #0000ff;
background-color: #000000;
}
</style>
<![endif]-->
<!--[if lt IE 8]>
<style type="text/css">
body {
color: #000000;
background-color: #ffffff;
}
</style>
<![endif]-->
</head>
<body>
<h1>
<!--[if gte IE 8]>
Chapter 1.
<![endif]-->
First Chapter
</h1>
<h1>
<!--[if gte IE 8]>
Chapter 2.
<![endif]-->
Second Chapter
</h1>
Text any version will see.
</body>
</html>
For more information on versioning and Windows Internet
Explorer modes, see Defining
Document Compatibility.
Controlling Default
Rendering
When
Internet Explorer 8 encounters a Web page that does not contain an X-UA-Compatible header, it uses the <!DOCTYPE> directive to determine how to display the page.
If the directive is missing or does not specify a standards-based document
type, Internet Explorer 8 displays the page in IE5 mode (quirks mode).
If
the <!DOCTYPE> directive
specifies a standards-based document type, Internet Explorer 8 displays the
page in IE8 mode, except in the following cases:
·
Compatibility View is enabled for the page.
·
The page is loaded in the Intranet zone and
Internet Explorer 8 is configured to pages in the Intranet zone in
Compatibility View.
·
Internet Explorer 8 is configured to
display all Web sites in Compatibility View.
·
Internet Explorer 8 is configured to use
the Compatibility View List, which specifies a set of Web sites that are always
displayed in Compatibility View.
·
The Developer Tools are used to override
the settings specified in the Web page.
·
The Web page encountered a page layout
error and Internet Explorer 8 is configured to automatically recover from such
errors by reopening the page in Compatibility View.
For
more information, see Internet Explorer Blog: Compatibility
View Recap.
Note
When configured to load Intranet pages in Compatibility View, Internet Explorer
makes an exception for pages loaded using the localhost address or a loopback
address. Pages loaded using one of these techniques are
displayed in IE8 mode when the <!DOCTYPE> directive specifies a
standards based document type.
In addition, the following registry key
allows you to control the way Internet Explorer handles pages that do not
contain X-UA-Compatible headers.
HKEY_LOCAL_MACHINE
(or HKEY_CURRENT_USER)
SOFTWARE
Microsoft
Internet Explorer
Main
FeatureControl
FEATURE_BROWSER_EMULATION
iexplore.exe = (DWORD)
The DWORD value must equal one of the
following values.
·
7000: Pages containing standards-based <!DOCTYPE> directives are
displayed in IE7 mode.
·
8000: Pages containing standards-based <!DOCTYPE> directives are
displayed in IE8 mode
·
8888: Pages are always displayed in IE8
mode, regardless of the <!DOCTYPE>
directive. (This bypasses the exceptions listed earlier.)
By default, applications hosting the WebBrowser
Control open standards-based pages in IE7 mode unless the page
contains an appropriate X-UA-Compatible header. You can
change this by adding the name of the application executable file to the
FEATURE_BROWSER_EMULATION feature control key and setting the value appropriate
for the desired behavior.