CSS Compatibility in Internet Explorer
With each new release of Windows Internet Explorer, support for the World Wide Web Consortium (W3C) Cascading Style Sheets (CSS) standard has steadily improved. Microsoft Internet Explorer 6 was the first fully Cascading Style Sheets, Level 1 (CSS1)-compliant version of Internet Explorer. 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). Windows Internet Explorer 9 and Internet Explorer 10 add even more support for many CSS3 modules.
Note It is important to remember that many CSS3 modules are still in the Working Draft or Last Call stages. Until they reach the Candidate Recommendation stage, they could change significantly. For more information, see the latest CSS3 draft modules.
If your website targets browsers that include earlier versions of Internet Explorer, you want to know the level of CSS compliance for those versions. This article provides an at-a-glance look at CSS compliance across recent versions of Internet Explorer, including support in Internet Explorer 9 and Internet Explorer 10.
Note Newer features will not work on webpages that have an older document compatibility mode specified. For instance, a feature introduced in Internet Explorer 9 will not work if the page has been set to display in IE8 Standards mode, even if you're viewing the page in Internet Explorer 9. For more information on document compatibility modes, see Defining Document Compatibility.
This article's organization is loosely based on that of the CSS reference documentation on MSDN. It contains the following sections:
- Introduction
- At-rules
- Selectors
- Element Selectors
- Attribute Selectors
- Combinators
- Pseudo-classes
- Pseudo-elements
- Properties
- 2-D and 3-D Transforms
- Animations
- Border and Layout
- Color and Background
- Font and Text
- Generated Content
- Lists
- Multi-column Layout
- Positioning
- Printing
- Transitions
- User Interface
- Speech
- Media Queries
- Values
- Numbers
- Strings
- Shapes
- Functions
- Gradients
- Colors
- Keywords
- Units
- Related topics
Introduction
Each table lists support status information for grouped CSS features across recent versions of Internet Explorer. In each section, the first table represents features introduced in CSS2.1 or earlier, and the second table represents features planned (by the W3C) for CSS3.
A value of "Yes" in a cell indicates that the feature is implemented in that version of Internet Explorer.
A value of "Partial" in a cell indicates that the feature is only partially implemented in that version of Internet Explorer. For more information, click the link to view that feature's reference page on MSDN.
A value of "No" in a cell indicates that the feature is not implemented in that version of Internet Explorer.
A value of "Updated" in a cell indicates that the feature has been updated in that version of Internet Explorer.
At-rules
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| @charset | Yes | Yes | Yes | Yes | Yes |
| @import | Yes | Yes | Yes | Yes | Yes |
| @media | Yes | Yes | Yes | Updated | Updated |
| @page | Partial | Partial | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| @font-face | Yes | Yes | Yes | Updated | Yes |
| @namespace | No | No | No | Yes | Yes |
| @keyframes | No | No | No | No | Yes |
| @-ms-viewport | No | No | No | No | Yes |
Selectors
Element Selectors
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| .value { sRules } | Class (see Note) | Partial | Yes | Yes | Yes | Yes |
| #value { sRules } | ID | Yes | Yes | Yes | Yes | Yes |
| E { sRules } | Type | Yes | Yes | Yes | Yes | Yes |
| * { sRules } | Universal | No | Yes | Yes | Yes | Yes |
Note Prior to Windows Internet Explorer 7, there was a two-class selector limit per element.
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| ns|E { sRules } | Namespaced | No | No | No | Yes | Yes |
Attribute Selectors
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| [att=val] { sRules } | Equality [=] | No | Yes | Yes | Yes | Yes |
| [att] { sRules } | Existence [] | No | Yes | Yes | Yes | Yes |
| [att|=val] { sRules } | Hyphen [|=] | No | Yes | Yes | Yes | Yes |
| [att~=val] { sRules } | Whitespace [~=] | No | Yes | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| [ns|attr] { sRules } | Namespaced | No | Yes | Yes | Yes | Yes |
| [att^=val] { sRules } | Prefix [^=] | No | Yes | Yes | Yes | Yes |
| [att*=val] { sRules } | Substring [*=] | No | Yes | Yes | Yes | Yes |
| [att$=val] { sRules } | Suffix [$=] | No | Yes | Yes | Yes | Yes |
Combinators
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| E + F { sRules } | Adjacent Sibling (+) | No | Yes | Yes | Yes | Yes |
| E > F { sRules } | Child (>) | No | Yes | Yes | Yes | Yes |
| E F { sRules } | Descendant | Yes | Yes | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| E ~ F { sRules } | General Sibling (~) | No | Yes | Yes | Yes | Yes |
Pseudo-classes
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| :active { sRules } | :active | No | Partial | Yes | Yes | Yes |
| :first-child { sRules } | :first-child | No | Yes | Yes | Yes | Yes |
| :focus { sRules } | :focus | No | No | Yes | Yes | Yes |
| :hover { sRules } | :hover | Partial | Yes | Yes | Yes | Yes |
| :lang(C) { sRules } | :lang() | No | No | Yes | Yes | Yes |
| :link { sRules } | :link | Yes | Yes | Yes | Yes | Yes |
| :visited { sRules } | :visited | Yes | Yes | Yes | Yes | Yes |
| @page :first { sRules } | @page :first | No | No | Yes | Yes | Yes |
| @page :left { sRules } | @page :left | No | No | Yes | Yes | Yes |
| @page :right { sRules } | @page :right | No | No | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| :root { sRules } | :root | No | No | No | Yes | Yes |
| :nth-child(n) { sRules } | :nth-child(n) | No | No | No | Yes | Yes |
| :nth-last-child(n) { sRules } | :nth-last-child(n) | No | No | No | Yes | Yes |
| :nth-of-type(n) { sRules } | :nth-of-type(n) | No | No | No | Yes | Yes |
| :nth-last-of-type(n) { sRules } | :nth-last-of-type(n) | No | No | No | Yes | Yes |
| :last-child { sRules } | :last-child | No | No | No | Yes | Yes |
| :first-of-type { sRules } | :first-of-type | No | No | No | Yes | Yes |
| :last-of-type { sRules } | :last-of-type | No | No | No | Yes | Yes |
| :only-child { sRules } | :only-child | No | No | No | Yes | Yes |
| :only-of-type { sRules } | :only-of-type | No | No | No | Yes | Yes |
| :empty { sRules } | :empty | No | No | No | Yes | Yes |
| :target { sRules } | :target | No | No | No | Yes | Yes |
| :not(s) { sRules } | :not(s) | No | No | No | Yes | Yes |
| :enabled { sRules } | :enabled | No | No | No | Yes | Yes |
| :disabled { sRules } | :disabled | No | No | No | Yes | Yes |
| :checked { sRules } | :checked | No | No | No | Yes | Yes |
| :indeterminate { sRules } | :indeterminate | No | No | No | Yes | Yes |
| :default { sRules } | :default | No | No | No | No | No |
| :valid { sRules } | :valid | No | No | No | No | Yes |
| :invalid { sRules } | :invalid | No | No | No | No | Yes |
| :in-range { sRules } | :in-range | No | No | No | No | No |
| :out-of-range { sRules } | :out-of-range | No | No | No | No | No |
| :required { sRules } | :required | No | No | No | No | Yes |
| :optional { sRules } | :optional | No | No | No | No | Yes |
| :read-only { sRules } | :read-only | No | No | No | No | No |
| :read-write { sRules } | :read-write | No | No | No | No | No |
Pseudo-elements
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| :after { sRules } | :after | No | No | Yes | Yes* | Yes* |
| :before { sRules } | :before | No | No | Yes | Yes* | Yes* |
| :first-letter { sRules } | :first-letter | Yes | Yes | Yes | Yes* | Yes* |
| :first-line { sRules } | :first-line | Yes | Yes | Yes | Yes* | Yes* |
* It is recommended you use the two-colon (::) form of this pseudo-element in this version of Internet Explorer.
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| ::after { sRules } | ::after | No | No | No | Yes | Yes |
| ::before { sRules } | ::before | No | No | No | Yes | Yes |
| ::first-letter { sRules } | ::first-letter | No | No | No | Yes | Yes |
| ::first-line { sRules } | ::first-line | No | No | No | Yes | Yes |
| ::selection { sRules } | ::selection | No | No | No | Yes | Yes |
| ::value { sRules } | ::value | No | No | No | No | No |
| ::choices { sRules } | ::choices | No | No | No | No | No |
| ::repeat-item { sRules } | ::repeat-item | No | No | No | No | No |
| ::repeat-index { sRules } | ::repeat-index | No | No | No | No | No |
Properties
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { sRule!important } | !important Declaration | Partial | Yes | Yes | Yes | Yes |
2-D and 3-D Transforms
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { transform : sFunction } | transform | No | No | No | Yes (2-D only) | Updated (2-D and 3-D) |
| { transform-origin : sOrigin } | transform-origin | No | No | No | Yes (2-D only) | Updated (2-D and 3-D) |
| { transform-style : sStyle } | transform-style | No | No | No | No | Yes |
| { perspective : sPerspective } | perspective | No | No | No | No | Yes |
| { perspective-origin : sOrigin } | perspective-origin | No | No | No | No | Yes |
| { backface-visibility : sVisibility } | backface-visibility | No | No | No | No | Yes |
Animations
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { animation-name : sAnimation } | animation-name | No | No | No | No | Yes |
| { animation-duration : sDuration } | animation-duration | No | No | No | No | Yes |
| { animation-timing-function : sFunction } | animation-timing-function | No | No | No | No | Yes |
| { animation-iteration-count : iCount } | animation-iteration-count | No | No | No | No | Yes |
| { animation-direction : sDirection } | animation-direction | No | No | No | No | Yes |
| { animation-play-state : sVisibility } | animation-play-state | No | No | No | No | Yes |
| { animation-delay : sDelay } | animation-delay | No | No | No | No | Yes |
| { animation-fill-mode : sMode } | animation-fill-mode | No | No | No | No | Yes |
| { animation : sAnimation } | animation | No | No | No | No | Yes |
Border and Layout
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { border : sBorder } | border | Yes | Yes | Yes | Yes | Yes |
| { border-bottom : sBottom } | border-bottom | Yes | Yes | Yes | Yes | Yes |
| { border-bottom-color : sColor } | border-bottom-color | Yes | Yes | Yes | Yes | Yes |
| { border-bottom-style : sStyle } | border-bottom-style | Yes | Yes | Yes | Yes | Yes |
| { border-bottom-width : sWidth } | border-bottom-width | Yes | Yes | Yes | Yes | Yes |
| { border-collapse : sCollapse } | border-collapse | Partial | Partial | Yes | Yes | Yes |
| { border-color : sColor } | border-color | Yes | Yes | Yes | Yes | Yes |
| { border-left : sLeft } | border-left | Yes | Yes | Yes | Yes | Yes |
| { border-left-color : sColor } | border-left-color | Yes | Yes | Yes | Yes | Yes |
| { border-left-style : sStyle } | border-left-style | Yes | Yes | Yes | Yes | Yes |
| { border-left-width : sWidth } | border-left-width | Yes | Yes | Yes | Yes | Yes |
| { border-right : sRight} | border-right | Yes | Yes | Yes | Yes | Yes |
| { border-right-color : sColor } | border-right-color | Yes | Yes | Yes | Yes | Yes |
| { border-right-style : sStyle } | border-right-style | Yes | Yes | Yes | Yes | Yes |
| { border-right-width : sWidth } | border-right-width | Yes | Yes | Yes | Yes | Yes |
| { border-spacing : sSpacing } | border-spacing | No | No | Yes | Yes | Yes |
| { border-style : sStyle } | border-style | Partial | Partial | Yes | Yes | Yes |
| { border-top : sTop } | border-top | Yes | Yes | Yes | Yes | Yes |
| { border-top-color : sColor } | border-top-color | Yes | Yes | Yes | Yes | Yes |
| { border-top-style : sStyle } | border-top-style | Yes | Yes | Yes | Yes | Yes |
| { border-top-width : sWidth } | border-top-width | Yes | Yes | Yes | Yes | Yes |
| { border-width : sWidth } | border-width | Yes | Yes | Yes | Yes | Yes |
| { caption-side : sLocation } | caption-side | No | No | Yes | Yes | Yes |
| { clear : sClear } | clear | Yes | Yes | Yes | Yes | Yes |
| { empty-cells : sEmptyCells } | empty-cells | No | Partial | Yes | Yes | Yes |
| { float : sFloat } | float | Yes | Yes | Yes | Yes | Yes |
| { margin : sMargin } | margin | Yes | Yes | Yes | Yes | Yes |
| { margin-bottom : sHeight } | margin-bottom | Yes | Yes | Yes | Yes | Yes |
| { margin-left : sWidth } | margin-left | Yes | Yes | Yes | Yes | Yes |
| { margin-right : sWidth } | margin-right | Yes | Yes | Yes | Yes | Yes |
| { margin-top : sHeight } | margin-top | Yes | Yes | Yes | Yes | Yes |
| { padding : sPadding } | padding | Yes | Yes | Yes | Yes | Yes |
| { padding-bottom : sPadding } | padding-bottom | Yes | Yes | Yes | Yes | Yes |
| { padding-left : sPadding } | padding-left | Yes | Yes | Yes | Yes | Yes |
| { padding-right : sPadding } | padding-right | Yes | Yes | Yes | Yes | Yes |
| { padding-top : sPadding } | padding-top | Yes | Yes | Yes | Yes | Yes |
| { table-layout : sLayout } | table-layout | Yes | Yes | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { border-break : sBreak } | border-break | No | No | No | No | No |
| { border-image : sImage } | border-image | No | No | No | No | No |
| { border-radius : sRadius } | border-radius | No | No | No | Yes | Yes |
| { box-shadow : sShadow } | box-shadow | No | No | No | Yes | Yes |
Color and Background
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { color : sColor } | color | Yes | Yes | Yes | Yes | Yes |
| { background : sBackground } | background | Yes | Yes | Yes | Updated | Yes |
| { background-attachment : sAttachment } | background-attachment | Partial | Yes | Yes | Updated | Yes |
| { background-color : sColor } | background-color | Yes | Yes | Yes | Updated | Yes |
| { background-image : sLocation } | background-image | Yes | Yes | Yes | Updated | Yes |
| { background-position : sPosition } | background-position | Partial | Partial | Yes | Updated | Yes |
| { background-repeat : sRepeat } | background-repeat | Yes | Yes | Yes | Updated | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { color-profile : sProfile } | color-profile | No | No | No | No | No |
| { rendering-intent : sIntent } | rendering-intent | No | No | No | No | No |
{ background : sBackground1, sBackground2, etc. } |
background (multiple) | No | No | No | Yes | Yes |
| { background-clip : sClip } | background-clip | No | No | No | Yes | Yes |
| { background-origin : sOrigin } | background-origin | No | No | No | Yes | Yes |
| { background-break : sBreak } | background-break | No | No | No | No | No |
| { background-size : sSize } | background-size | No | No | No | Yes | Yes |
Font and Text
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { direction : sDirection } | direction | Yes | Yes | Yes | Yes | Yes |
| { font : sFont } | font | Yes | Yes | Yes | Yes | Yes |
| { font-family : sFamily } | font-family | Yes | Yes | Yes | Yes | Yes |
| { font-size : sSize } | font-size | Yes | Yes | Yes | Yes | Yes |
| { font-style : sStyle } | font-style | Yes | Yes | Yes | Yes | Yes |
| { font-variant : sVariant } | font-variant | Yes | Yes | Yes | Yes | Yes |
| { font-weight : sWeight } | font-weight | Partial | Partial | Yes | Yes | Yes |
| { letter-spacing : sSpacing } | letter-spacing | Yes | Yes | Yes | Yes | Yes |
| { line-height : sHeight } | line-height | Yes | Yes | Yes | Yes | Yes |
| { text-align : sAlign } | text-align | Yes | Yes | Yes | Yes | Yes |
| { text-decoration : sDecoration } | text-decoration | Yes | Yes | Yes | Yes | Yes |
| { text-indent : sIndent } | text-indent | Yes | Yes | Yes | Yes | Yes |
| { text-transform : sTransform } | text-transform | Yes | Yes | Yes | Yes | Yes |
| { unicode-bidi : sAlign } | unicode-bidi | Yes | Yes | Yes | Yes | Yes |
| { vertical-align : sAlign } | vertical-align | Yes | Yes | Yes | Yes | Yes |
| { white-space : sWrap } | white-space | Partial | Partial | Yes | Yes | Yes |
| { word-spacing : sSpacing } | word-spacing | Partial | Partial | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { font-effect : sEffect } | font-effect | No | No | No | No | No |
| { font-emphasize : sEmphasize } | font-emphasize | No | No | No | No | No |
| { font-feature-settings : sTags } | font-feature-settings | No | No | No | No | Yes |
| { font-size-adjust : sSizeAdjust } | font-size-adjust | No | No | No | No | No |
| { font-smooth : sSmooth } | font-smooth | No | No | No | No | No |
| { font-stretch : sStretch } | font-stretch | No | No | No | Yes | Yes |
| { hanging-punctuation : sHangingPunctuation } | hanging-punctuation | No | No | No | No | No |
| { hyphens : sHyphens } | -ms-hyphens | No | No | No | No | Yes |
| { hyphenate-limit-zone : sZone } | -ms-hyphenate-limit-zone | No | No | No | No | Yes |
| { hyphenate-limit-chars : iChar } | -ms-hyphenate-limit-chars | No | No | No | No | Yes |
| { hyphenate-limit-lines : iLines } | -ms-hyphenate-limit-lines | No | No | No | No | Yes |
| { punctuation-trim : sTrim } | punctuation-trim | No | No | No | No | No |
| { ruby-align : sRubyAlign } | ruby-align | Yes | Yes | Yes | Yes | Yes |
| { ruby-overhang : sRubyOverhang } | ruby-overhang | Yes | Yes | Yes | Yes | Yes |
| { ruby-position : sRubyPlacement } | ruby-position | Yes | Yes | Yes | Yes | Yes |
| { ruby-span : sRubySpan } | ruby-span | No | No | No | No | No |
| { text-align-last : sAlignLast } | text-align-last | Partial | Partial | Partial | Partial | Partial |
| { text-emphasis : sEmphasis } | text-emphasis | No | No | No | No | No |
| { text-justify : sJustify } | text-justify | Yes | Yes | Yes | Yes | Yes |
| { text-outline : sOutline } | text-outline | No | No | No | No | No |
| { text-overflow : sOverflow} | text-overflow | Partial | Partial | Partial | Partial | Partial |
| { text-shadow : sShadow } | text-shadow | No | No | No | No | Yes |
| { text-wrap : sWrap } | text-wrap | No | No | No | No | No |
| { word-break : sBreak } | word-break | Partial | Partial | Partial | Partial | Partial |
| { word-wrap : sWrap } | word-wrap | Yes | Yes | Yes | Yes | Yes |
| { writing-mode : sFlow } | writing-mode | Yes | Yes | Yes | Yes | Yes |
Generated Content
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { content : sContent } | content | No | No | Yes | Yes | Yes |
| { counter-increment : sCounter } | counter-increment | No | No | Yes | Yes | Yes |
| { counter-reset : sCounter } | counter-reset | No | No | Yes | Yes | Yes |
| { quotes : sQuotes } | quotes | No | No | Yes | Yes | Yes |
Lists
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { list-style : sStyle } | list-style | Yes | Yes | Yes | Yes | Yes |
| { list-style-image : sStyle } | list-style-image | Yes | Yes | Yes | Yes | Yes |
| { list-style-position : sStyle } | list-style-position | Yes | Yes | Yes | Yes | Yes |
| { list-style-type : sStyle } | list-style-type | No | Partial | Yes | Yes | Yes |
Multi-column Layout
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { column-width : sWidth } | column-width | No | No | No | No | Yes |
| { column-count : sCount } | column-count | No | No | No | No | Yes |
| { columns : sColumns } | columns | No | No | No | No | Yes |
| { column-gap : sGap } | column-gap | No | No | No | No | Yes |
| { column-rule-color : sColor } | column-rule-color | No | No | No | No | Yes |
| { column-rule-style : sStyle} | column-rule-style | No | No | No | No | Yes |
| { column-rule-width : sWidth } | column-rule-width | No | No | No | No | Yes |
| { column-rule : sRule } | column-rule | No | No | No | No | Yes |
| { break-before : sBreak } | break-before | No | No | No | No | Yes |
| { break-after : sBreak } | break-after | No | No | No | No | Yes |
| { break-inside : sBreak } | break-inside | No | No | No | No | Yes |
| { column-span : sSpan } | column-span | No | No | No | No | Yes |
| { column-fill : sFill } | column-fill | No | No | No | No | Yes |
Positioning
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { bottom : sBottom } | bottom | Partial | Partial | Yes | Yes | Yes |
| { clip : sClip } | clip | Yes | Yes | Yes | Yes | Yes |
| { display : sDisplay } | display | Partial | Partial | Yes | Yes | Yes |
| { height : sHeight } | height | Yes | Yes | Yes | Yes | Yes |
| { left : sPosition } | left | Partial | Partial | Yes | Yes | Yes |
| { max-height : sMaxHeight } | max-height | No | Yes | Yes | Yes | Yes |
| { max-width : sWidth } | max-width | No | Yes | Yes | Yes | Yes |
| { min-height : sMinHeight } | min-height | No | Yes | Yes | Yes | Yes |
| { min-width : sMinWidth } | min-width | No | Yes | Yes | Yes | Yes |
| { overflow : sOverflow } | overflow | Partial | Yes | Yes | Yes | Yes |
| { position : sPosition } | position | Partial | Yes | Yes | Yes | Yes |
| { right : sPosition } | right | Partial | Partial | Yes | Yes | Yes |
| { top : sTop } | top | Partial | Partial | Yes | Yes | Yes |
| { visibility : sVisibility } | visibility | Yes | Yes | Yes | Yes | Yes |
| { width : sWidth } | width | Yes | Yes | Yes | Yes | Yes |
| { z-index : vOrder } | z-index | Partial | Partial | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { overflow-x : sOverflow } | overflow-x | Partial | Yes | Yes | Yes | Yes |
| { overflow-y : sOverflow } | overflow-y | Partial | Yes | Yes | Yes | Yes |
Printing
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { orphans : nLines } | orphans | No | No | Yes | Yes | Yes |
| { page-break-after : sBreak } | page-break-after | Yes | Yes | Yes | Yes | Yes |
| { page-break-before : sBreak } | page-break-before | Yes | Yes | Yes | Yes | Yes |
| { page-break-inside : sBreak } | page-break-inside | No | No | Yes | Yes | Yes |
| { widows : nLines } | widows | No | No | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { fit : sFit } | fit | No | No | No | No | No |
| { fit-position : sPosition } | fit-position | No | No | No | No | No |
| { image-orientation : sOrientation } | image-orientation | No | No | No | No | No |
| { page : sPage } | page | No | No | No | No | No |
| { size : sSize } | size | No | No | No | No | No |
Transitions
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { transition-property : sProperty } | transition-property | No | No | No | No | Yes |
| { transition-duration : sDuration } | transition-duration | No | No | No | No | Yes |
| { transition-timing-function : sFunction } | transition-timing-function | No | No | No | No | Yes |
| { transition-delay : sDelay } | transition-delay | No | No | No | No | Yes |
| { transition : sTransition } | transition | No | No | No | No | Yes |
User Interface
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { cursor : sCursor } | cursor | Yes | Yes | Yes | Yes | Yes |
| { outline : sOutline } | outline | No | No | Yes | Yes | Yes |
| { outline-color : sColor } | outline-color | No | No | Yes | Yes | Yes |
| { outline-style : sStyle } | outline-style | No | No | Yes | Yes | Yes |
| { outline-width : sWidth } | outline-width | No | No | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | ||
|---|---|---|---|---|---|---|
| { appearance : sAppearance } | appearance | No | No | No | No | No |
| { box-sizing : sSizing } | box-sizing | No | No | Yes | Yes | Yes |
| { icon : sIcon } | icon | No | No | No | No | No |
| { nav-down : sNavDown } | nav-down | No | No | No | No | No |
| { nav-index : sIndex } | nav-index | No | No | No | No | No |
| { nav-left : sNavLeft } | nav-left | No | No | No | No | No |
| { nav-right : sNavRight } | nav-right | No | No | No | No | No |
| { nav-up : sNavUp } | nav-up | No | No | No | No | No |
| { outline-offset : sOffset } | outline-offset | No | No | No | No | No |
| { outline-radius : sRadius } | outline-radius | No | No | No | No | No |
| { resize : sResize } | resize | No | No | No | No | No |
Speech
Internet Explorer does not support any of the CSS3 speech properties.
Media Queries
The following CSS3 media query properties are supported in Internet Explorer 9:
- width
- height
- device-width
- device-height
- orientation
- aspect-ratio
- device-aspect-ratio
- color
- color-index
- monochrome
- resolution
Values
Numbers
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| <number> | Yes | Yes | Yes | Yes | Yes |
| <length> | Yes | Yes | Yes | Yes | Yes |
| <percentage> | Yes | Yes | Yes | Yes | Yes |
| <integer> | Yes | Yes | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| <angle> | No | No | No | Yes | Yes |
| <time> | No | No | No | Yes | Yes |
| <frequency> | No | No | No | No | No |
Strings
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| <string> | Yes | Yes | Yes | Yes | Yes |
| \code | Yes | Yes | Yes | Yes | Yes |
Shapes
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| rect() | Yes | Yes | Yes | Yes | Yes |
Functions
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| url() | Yes | Yes | Yes | Yes | Yes |
| counter() | No | No | Yes | Yes | Yes |
| attr() | No | No | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| calc() | No | No | No | Yes | Yes |
Gradients
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| linear-gradient() | No | No | No | No | Yes |
| radial-gradient() | No | No | No | No | Yes |
| repeating-linear-gradient() | No | No | No | No | Yes |
| repeating-radial-gradient() | No | No | No | No | Yes |
Colors
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| <color> (names) | Yes | Yes | Yes | Yes | Yes |
| <color> (#rrggbb or #rgb Notation) | Yes | Yes | Yes | Yes | Yes |
| <color> (rgb(r,g,b) Notation) | Yes | Yes | Yes | Yes | Yes |
| <color> (system colors) | Yes | Yes | Yes | Yes | Yes |
| transparent | Partial | Yes | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| <color> (rgba(r,g,b,a) Notation) | No | No | No | Yes | Yes |
| <color> (hsl(h,s,l) Notation) | No | No | No | Yes | Yes |
| <color> (hsla(h,s,l,a) Notation) | No | No | No | Yes | Yes |
Keywords
CSS2.1:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| auto | Partial | Yes | Yes | Yes | Yes |
| inherit | No | No | Yes | Yes | Yes |
CSS3:
| Internet Explorer 6 | Internet Explorer 7 | Internet Explorer 8 | Internet Explorer 9 | Internet Explorer 10 | |
|---|---|---|---|---|---|
| initial | No | No | No | No | No |
Units
The following units are supported in Microsoft Internet Explorer 3.0 and later:
- px
- pt
- pc
- cm
- mm
- in
- em
- ex
- %
The following CSS3 units are supported in Internet Explorer 9 and later:
- deg
- grad
- rad
- turn
- ms
- s
- rem
- vw
- vh
- vm
- ch
The following units are not supported in any version of Internet Explorer:
- Hz
- kHz
- gd