|
The following tables compare CSS compatibility and support for a number of layout engines. Please see the individual products' articles for further information. This article is not all-inclusive or necessarily up-to-date. Unless otherwise specified in footnotes, comparisons are based on the stable versions without any add-ons, extensions or external programs.
[edit] Explanation of the tables
[edit] Engine nomenclature
Rather than the names of web browsers, the names of the underlying engines are used. The browsers that use the various engines are listed below.
[edit] Values
Values indicate the level of support in the most recent version of the layout engine, or (if a version number is given) in the specified version. Version numbers without any other value indicate the version at which the layout engine first fully supported the feature.
| Value |
Meaning |
| Yes |
Indicates that the layout engine fully supports this property when valid values are used. |
| No |
Indicates that this property is completely ignored. |
| Partial |
Indicates that the property is understood, but that not all values are supported. Supported values are implemented correctly. |
| Incorrect |
Indicates that the property is understood, but that it is not implemented correctly in all cases. |
| Experimental |
Indicates that the property is provided in experimental form under an alternative name, generally with only partial functionality. |
[edit] CSS version support
|
|
This article or section is incomplete and may require expansion and/or cleanup.
Please improve the article, or discuss the issue on the talk page. |
See the article Cascading Style Sheets for more information on the different versions of CSS. This table doesn't reference CSS2.0, as CSS2.1 was intended to replace it by correcting or removing a few errors and features rejected by the CSS community. Most of the removed CSS2 features will be made obsolete by CSS3.
[edit] Grammar and rules
|
Trident |
Tasman |
Gecko |
WebKit |
KHTML |
Presto |
iCab |
Prince XML |
| CSS2 |
!important |
Weight increasing |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| /*Comment*/ |
Comments |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| @import |
Import stylesheet |
4.0 |
0 |
1.0 |
Yes |
Yes |
7.0 |
Yes |
2.1 |
| @charset |
Character set |
5.5 |
? |
1.0 |
0 |
No |
7.0 |
Yes |
Yes |
| @media |
Media-specific rules |
5.5 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
5.1 |
| @page |
For paged media |
5.5 |
No |
No [1] |
No |
No |
7.0 |
No |
6.0 |
| CSS3 |
@namespace |
Namespace declaration |
No |
No |
1.0 |
Yes |
Yes |
8.0 |
No |
5.0 |
| @font-face |
Define font |
5.5 |
No |
1.9.1 |
525 |
No |
10.0 |
No |
6.0 |
[edit] Trident grammar and rule notes
- !important — !important doesn't override rules defined later in the same declaration block prior to IE7.
- @import — Media type support is broken in all versions including IE7. For @import exampleurl examplemedia; IE requests the url exampleurl%20examplemedia and will include url() and/or quotes in the url, too, if present in the @import rule.
- @font-face — Only supports Embedded OpenType (.eot) font format, does not understand the format() identifier.
[edit] Tasman grammar and rule notes
- @font-face — Versions 5.16 and 5.17 will download fonts specified but not use them. 5.23 no longer downloads the font.
[edit] Gecko grammar and rule notes
- @font-face — Does not support @font-face on Linux: [2]
[edit] Presto grammar and rule notes
- @import — Whilst Gecko, WebKit and iCab download all media stylesheets immediately, Opera only downloads handheld, print, projection and screen media, as well as speech if "voice" feature is enabled and tv, on tv devices. Text browser emulation mode is only a user stylesheet, so it does not switch to tty media type. This is consistent with older text browsers, which do not respect any CSS.
[edit] Selectors
|
Trident |
Tasman |
Gecko |
WebKit |
KHTML |
Presto |
iCab |
Prince XML |
| Element selectors |
| CSS2 |
* |
Universal |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| E |
Element |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| E.class |
Class |
7.0 |
Incorrect |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| E#id |
ID |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| CSS3 |
ns|E |
Namespaced |
No |
No |
1.0 |
Yes |
Yes |
8.0 |
No |
? |
| Relationship selectors |
| CSS2 |
E F |
Descendant |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| E > F |
Child |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| E + F |
Direct adjacent |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| CSS3 |
E ~ F |
Indirect adjacent |
7.0 |
0.9 |
1.7 |
412 |
3.3.2 |
9.0 |
3.0 |
Yes |
| Attribute selectors |
| CSS2 |
E[attr] |
Has |
7.0 |
0.9 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| E[attr="value"] |
Equals |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
Yes |
| E[attr~="value"] |
Contains (space-separated) |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
Yes |
| E[attr|="value"] |
Contains (hyphen-separated) |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
Yes |
| CSS3 |
E[attr^="value"] |
Begins with |
7.0 |
No |
1.0 |
Yes |
3.4 |
8.02 |
3.0 |
Yes |
| E[attr$="value"] |
Ends with |
7.0 |
No |
1.0 |
Yes |
3.4 |
9.0 |
3.0 |
Yes |
| E[attr*="value"] |
Contains substring |
7.0 |
No |
1.0 |
Yes |
3.4 |
9.0 |
3.0 |
Yes |
| E[ns|attr] |
Namespaced |
No |
No |
1.0 |
Yes |
3.4 |
9.0 |
No |
? |
| Pseudo-classes |
| CSS2 |
E:link |
Unvisited hyperlink |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
6.0 |
| E:visited |
Visited hyperlink |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| E:active |
Active |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| E:hover |
Mouseover |
7.0 |
0.9 |
1.0 |
419.3 |
Yes |
7.0 |
3.0 |
Yes |
| E:focus |
Focused |
8.0 |
0 |
1.0 |
Yes |
Yes |
7.0 |
Yes |
Yes |
| E:first-child |
First child |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| E:lang() |
Language |
8.0 |
0 |
1.2 |
525 |
3.4 |
7.5 |
3.0 |
Yes |
| CSS3 |
E:root |
Root |
No |
0.1 |
1.0 |
85 |
3.4 |
9.5 |
No |
Yes |
| E:first-of-type |
First child of type |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:last-child |
Last child |
No |
0.9 |
1.0 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:last-of-type |
Last child of type |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:only-child |
Only child |
No |
0.9 |
1.8 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:only-of-type |
Only child of type |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:nth-child |
Nth child |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:nth-last-child |
Nth last child |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:nth-of-type |
Nth child of type |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:nth-last-of-type |
Nth last child of type |
No |
0.9 |
1.9.1 |
525 |
3.4 |
9.5 |
No |
Yes |
| E:target |
Target |
No |
0.9 |
1.3 |
525 |
3.4 |
Partial |
No |
No |
| E:empty |
Empty |
No |
0.9 |
1.8 |
412 |
3.4 |
9.5 |
No |
Yes |
| E:not() |
Negation |
No |
0.9 |
1.0 |
85 |
3.4 |
9.5 |
No |
Yes |
| E:enabled |
Enabled state |
No |
0.9 |
1.8 |
525 |
3.4 |
9.0 |
No |
? |
| E:disabled |
Disabled state |
No |
0.9 |
1.8 |
525 |
3.4 |
9.0 |
No |
? |
| E:checked |
Checked state |
No |
No |
1.0 |
525 |
3.4 |
9.0 |
No |
? |
| E:indeterminate |
Indeterminate state |
No |
0.9 |
No |
No |
No |
No |
No |
? |
| E:default |
Default |
No |
No |
1.9 |
No |
No |
9.0 |
No |
? |
| E:valid |
Valid |
No |
No |
1.8 |
No |
No |
9.0 |
No |
? |
| E:invalid |
Invalid |
No |
No |
1.8 |
No |
No |
9.0 |
No |
? |
| E:in-range |
In range |
No |
No |
1.8 |
No |
No |
9.0 |
No |
? |
| E:out-of-range |
Out of range |
No |
No |
1.8 |
No |
No |
9.0 |
No |
? |
| E:required |
Required |
No |
No |
No |
No |
No |
9.0 |
No |
? |
| E:optional |
Optional |
No |
No |
No |
No |
No |
9.0 |
No |
? |
| E:read-only |
Read-only |
No |
No |
Experimental |
No |
No |
9.0 |
No |
? |
| E:read-write |
Read and write |
No |
No |
Experimental |
No |
No |
9.0 |
No |
? |
| Pseudo-elements |
| CSS2 |
E:first-letter |
First letter |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
5.0 |
| E:first-line |
First line |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
No |
| E:before |
Before |
8.0 |
No |
1.0 (1.9.1) |
85 |
Yes |
7.0 |
3.0 |
Yes |
| E:after |
After |
8.0 |
No |
1.0 (1.9.1) |
85 |
Yes |
7.0 |
3.0 |
Yes |
| CSS3 |
E::before |
Double colon notation |
No |
No |
1.5 (1.9.1) |
85 |
3.4 |
7.0 |
Yes |
Yes |
| E::after |
Double colon notation |
No |
No |
1.5 (1.9.1) |
85 |
3.4 |
7.0 |
Yes |
Yes |
| E::first-letter |
Double colon notation |
No |
0.9 |
1.5 |
85 |
3.4 |
7.0 |
Yes |
Yes |
| E::first-line |
Double colon notation |
No |
0.9 |
1.5 |
85 |
3.4 |
7.0 |
Yes |
No |
| E::selection |
Selection |
No |
0.9 |
Experimental |
412 |
3.4 |
9.5 |
No |
No |
| |
Trident |
Tasman |
Gecko |
WebKit |
KHTML |
Presto |
iCab |
Prince XML |
[edit] Trident selector notes
- :active —
:active is for anchor element only.
- :hover —
:hover is applied for all elements only in standards-compliant mode, not quirks mode [3]. Prior to 7.0, :hover is for anchor element only.
- .one.two — only
.two class selector was taken into consideration before 7.0.
- * — Prior to 7.0 this was treated as a single or no element.
- :first-letter — float and vertical-align properties not allowed.
- :first-line — can't be attached to a inline-block element and background property doesn't work when pseudo-element is attached to a layout element.
[edit] Tasman selector notes
- :hover — For anchor element only prior to 0.9.
- .one.two — only
.two class selector is taken into consideration.
[edit] Gecko selector notes
- :*-of-type — See Bug 128585 on Bugzilla.
- :nth-* — See Bug 75375 on Bugzilla.
- (:):before, (:):after — CSS2.0 behavior : some properties are unimplemented prior to 1.9.1. See Bug 237119 on Bugzilla.
[edit] WebKit selector notes
- :lang() — Only detected when explicitly present on element being tested, attribute not inherited.
- :first-line —
text-transform doesn't apply with this pseudo-element. See Bug 3409 on Bugzilla.
[edit] Presto selector notes
- :target — Style doesn't get applied when navigating using back and forward buttons.
[edit] Properties
|
Trident |
Tasman |
Gecko |
WebKit |
KHTML |
Presto |
iCab |
Prince XML |
| Box model |
| CSS2 |
margin |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| padding |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| width |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| height |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| float |
5.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Yes |
| clear |
5.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| display |
Partial |
Partial |
Partial |
85 |
Yes |
7.0 |
Partial |
Yes |
| min-width |
7.0 |
0.9 |
1.0 |
416 |
Yes |
7.0 |
3.0 |
5.0 |
| max-width |
7.0 |
0.9 |
1.0 |
416 |
Yes |
7.0 |
3.0 |
5.0 |
| min-height |
7.0 |
0.9 |
1.7 |
416 |
3.3.2 |
7.0 |
3.0 |
5.0 |
| max-height |
7.0 |
0.9 |
1.7 |
416 |
3.3.2 |
7.0 |
3.0 |
5.0 |
| clip |
5.5 |
0.9 |
1.0 |
85 |
5.0 |
7.0 |
3.0 |
5.0 |
| overflow |
7.0 |
0 |
1.0 |
85 |
3.2 |
7.0 |
3.0 |
5.0 |
| visibility |
4.0 |
0.9 |
1.8 |
525 |
Partial |
Partial |
Partial |
5.0 |
| CSS3 |
overflow-x |
7.0 |
No |
1.8 |
525 |
3.5.6 |
9.5 |
No |
5.0 |
| overflow-y |
7.0 |
No |
1.8 |
525 |
3.5.6 |
9.5 |
No |
5.0 |
| Borders |
| CSS2 |
border |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-color |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-style |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-width |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-top |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-top-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-right |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-right-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-bottom |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-bottom-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-left |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-left-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-top-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-top-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-right-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-right-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-bottom-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-bottom-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-left-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| border-left-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.0 |
| CSS3 |
border-radius |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
6.0 |
| border-break |
No |
No |
No |
No |
No |
No |
No |
? |
| border-image |
No |
No |
Experimental (1.9.1) |
Experimental |
No |
No |
No |
No |
| box-shadow |
No |
No |
Experimental (1.9.1) |
Experimental |
No |
No |
No |
No |
| Line Layout |
| CSS2 |
line-height |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
5.0 |
| vertical-align |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| Positioning |
| CSS2 |
position |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
5.0 |
| top |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| right |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| bottom |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| left |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| z-index |
Partial |
Partial |
1.9 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| Generated and Replaced Content |
| CSS2 |
quotes |
No |
0.9 |
1.8 |
No |
3.4 |
7.0 |
3.0 |
5.0 |
| content |
8.0 |
No |
1.9 |
85 |
Yes |
7.0 |
3.0 |
5.0 |
| counter-increment |
8.0 |
No |
1.8 |
525 |
3.4 |
7.0 |
3.0 |
5.0 |
| counter-reset |
8.0 |
No |
1.8 |
525 |
3.4 |
7.0 |
3.0 |
5.0 |
| Lists |
| CSS2 |
list-style |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| list-style-image |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| list-style-position |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
6.0 |
| list-style-type |
8.0 |
0 |
1.0 |
85 |
3.4 |
8.0 |
3.0 |
6.0 |
| Colors |
| CSS2 |
color |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
5.0 |
| opacity |
No |
No |
1.7 |
125 |
Experimental |
9.0 |
No |
No |
| Backgrounds |
| CSS2 |
background |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
6.0 |
| background-attachment |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
5.0 |
| background-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.1 |
| background-image |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
6.0 |
| background-position |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
3.1 |
| background-repeat |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
3.1 |
| CSS3 |
background (multiple) |
No |
No |
No |
312 |
3.5 |
No |
No |
No |
| background-clip |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
No |
| background-origin |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
No |
| background-break |
No |
No |
No |
No |
No |
No |
No |
No |
| background-size |
No |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
| Fonts |
| CSS2 |
font |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| font-family |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| font-size |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
3.1 |
| font-style |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Yes |
| font-variant |
4.0 |
0 |
1.0 |
125 |
Yes |
7.0 |
3.0 |
Yes |
| font-weight |
Incorrect |
0 |
Partial |
Partial |
Yes |
Incorrect |
Incorrect |
Yes |
| CSS3 |
font-size-adjust |
No |
No |
1.9 |
No |
No |
No |
No |
No |
| font-stretch |
No |
No |
No |
No |
No |
No |
Incorrect |
No |
| font-effect |
No |
No |
No |
No |
No |
No |
No |
No |
| font-smooth |
No |
No |
No |
No |
No |
No |
No |
No |
| font-emphasize |
No |
No |
No |
No |
No |
No |
No |
No |
| Text |
| CSS2 |
text-align |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Partial |
Yes |
| text-decoration |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
3.1 |
| text-indent |
| |