CSS Improvements in Internet Explorer 8

New for Windows Internet Explorer 8
Note: This documentation is preliminary and is subject to change.

Internet Explorer 8 is the most Cascading Style Sheets (CSS)-compliant release yet. This topic is composed of a comprehensive list of the changes to CSS support in Internet Explorer 8 Beta 2.

Internet Explorer Beta 1 Changes

  • Data URI — This mechanism allows a Web page author to embed small entities directly within a Uniform Resource Identifier (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.
  • Floats — 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. Following are some of the fixed issues:
    • Cleared elements don't clear other nested floats when they don't share a parent
    • Cleared elements after floats have doubled top padding
  • Margin collapsing — Many changes have been made to margin collapsing, fixing many of the most troubling collapsing issues encountered with prior versions of Internet Explorer, and bringing margin collapsing into compliance with the CSS, Level 2 Revision 1 (CSS2.1) specification.
  • New Pseudo-classes — The following are new to Internet Explorer 8:
    • :before and :after— In conjunction with the new content rule, authors can describe dynamic ("generated") content to appear before and after elements in the document tree.
    • :focus — This pseudo-class applies while an element has input focus.
  • outline — Enables elements to be highlighted without affecting their size. The outline is a shorthand property for outline-color, outline-style, and outline-width.
  • Printing — The following properties have been added:
  • Table Layouts — 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 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.
  • text-decoration— Overline behavior now conforms to the CSS 2.1 specification.
  • New support for the following:

Internet Explorer Beta 2 Changes

Internet Explorer 8 Beta 2 contains all of the changes listed for Internet Explorer 8 Beta 1, plus the following:

  • Fully compliant support for the font-weight and word-spacing text attributes.
  • Fully compliant generated content support, including for the quotes attribute.
  • Fully compliant support for the empty-cells layout attribute.
  • Fully compliant support for the following positioning attributes:
  • The -ms-box-sizing attribute can now be used without the -ms- prefix, as in box-sizing.
  • The writing-mode attribute should now be used with the -ms- prefix, as in -ms-writing-mode.
  • Support for "CSS Expressions," or Dynamic Properties, has ended for Internet Explorer 8 Beta 2 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 mode, EmulateIE7 mode, or IE5 mode. For more information on document compatibility modes, see Defining Document Compatibility.

Related Topics

Community Additions