CSS Improvements in Windows Internet Explorer 8
Note As of December 2011, this topic has been archived and is no longer actively maintained. For more information, see Archived Content. For information, recommendations, and guidance regarding the current version of Windows Internet Explorer, see Internet Explorer Developer Center.
Windows Internet Explorer 8 is fully compliant with the Cascading Style Sheets, Level 2 Revision 1 (CSS2.1) specification and supports some features of Cascading Style Sheets, Level 3 (CSS3). This topic is composed of a comprehensive list of the changes to Cascading Style Sheets (CSS) support in Internet Explorer 8. For an at-a-glance look at CSS compliance across recent versions of Internet Explorer, see CSS Compatibility and Internet Explorer.
- Compatibility Note
- Pseudo-classes and Pseudo-elements
- Color and Background
- Font and Text
- Generated Content
- Border and Layout
- User Interface
- Internet Explorer-specific Functionality
- Data URIs
- Related topics
The changes to CSS compliance in Internet Explorer 8 described in this topic will only function when your page is in IE8 Standards mode (or EmulateIE8 mode with an Internet Explorer 8 !DOCTYPE directive). For more information on document compatibility modes, see Defining Document Compatibility.
The @page rule now works as expected with the
Internet Explorer 8 introduces support for the following pseudo-classes and pseudo-elements:
- :before and :after — In conjunction with the newly supported content property, you can use these pseudo-elements to describe dynamic ("generated") content to appear before and after elements in a document.
- :focus — This pseudo-class applies while an element has input focus.
- :lang(C) — This pseudo-class selects the elements that are in a given language.
Additional values have been added to the list-style-type attribute, bringing it to full CSS2.1 compliance.
The behavior of the background-position attribute is now fully CSS2.1 compliant.
The behavior of the following text attributes is now fully CSS2.1 compliant:
In addition, the text-decoration attribute's overline behavior now more closely conforms to the CSS2.1 specification.
Internet Explorer 8 introduces full support for generated content, including the following attributes:
Internet Explorer 8 introduces support for the following:
- The separated borders model (border-spacing attribute)
- Caption position and alignment (caption-side attribute)
The behavior of the following attributes is now fully CSS2.1 compliant:
Many changes have been made to float behaviors, fixing many of the most troubling float issues encountered with prior versions of Internet Explorer, including those caused by the requirement of the hasLayout property. The hasLayout functionality has been removed in Internet Explorer 8. The following are some of the issues fixed:
- Cleared elements don't clear other nested floats when they don't share a parent.
- Cleared elements after floats have doubled top padding.
Many changes have been made to margin collapsing behavior, fixing many of the most troubling collapsing issues encountered with prior versions of Internet Explorer, and bringing margin collapsing behavior into compliance with the CSS2.1 specification.
The behavior of the following positioning attributes is now fully CSS2.1 compliant:
The display attribute now supports the full range of table layout values from the W3C Cascading Style Sheets Level 2.1 Specification. For many years, tables were the preferred layout mechanism on the Internet. With Internet Explorer 8, it is now possible to apply table-style formatting to non-table elements by using the display attribute. In practice, CSS tables are more permissive than HTML markup; tables created with CSS rules will nest elements to become valid, whereas tables created with HTML will close containers to avoid unexpected nesting.
Internet Explorer 8 introduces support for the following printing attributes:
For more information on CSS printing functionality, see CSS How-to - Optimize Pages for Printing Using CSS.
Internet Explorer 8 introduces support for the outline attributes, which enable elements to be highlighted without affecting their size. This includes fully CSS 2.1-compliant support for the following attributes:
In addition, Internet Explorer 8 introduces support for the box-sizing attribute.
This section describes behavior not defined by the CSS2.1 specification.
Support for "CSS Expressions," or Dynamic Properties, has ended for Internet Explorer 8 in IE8 mode (or EmulateIE8 mode with an Internet Explorer 8 !DOCTYPE directive) for standards-compliance and performance reasons. However, they will still function as expected in Internet Explorer 8 on pages in IE7 Standards mode, EmulateIE7 mode, or IE5 (Quirks) mode. For more information on document compatibility modes, see Defining Document Compatibility.
The following CSS attributes are Microsoft extensions to the CSS2.1 specification and should be specified with an -ms- prefix in IE8 mode:
A data Uniform Resource Identifier (URI) allows a Web page author to embed small entities directly within a URI, rather than using the URI to identify a location from which to retrieve the entity. This is primarily of interest for small images (such as a bullet) used within CSS or layout. For more information, see data Protocol.
- CSS Compatibility and Internet Explorer