|
Comparison of layout engines (CSS)
Web Design & Development Guide
Comparison of layout engines (CSS)
Home | Up
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.
Engine Nomenclature
- Trident is the layout engine used in Internet Explorer for Windows.
Tasman is used in Internet Explorer for Macintosh.
Gecko in all Mozilla software.
WebCore provides the HTML layout engine for Mac OS X.
KHTML for KDE.
Presto for Opera.
iCab is a browser for the Mac.
Meaning of Values
"Yes" indicates that the current version of the browser 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.
"Buggy" indicates that the property is understood, but that it is not
implemented correctly in all cases. "Dangerous" indicates that the property is
understood, but that deleterious behaviour results. Version numbers, where
known, are provided to indicate when support for this feature was added. If
support was added in a publicly available unofficial release (such as an alpha
or beta version), a red background is used. Proprietary properties are not
included.
General overview
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.
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
CSS1 |
6.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS2.1 |
Partial |
Partial |
Mostly |
Mostly |
Mostly |
9.0 |
Mostly |
CSS3 |
No |
No |
Slight |
Slight |
Slight |
Slight |
Slight |
Grammar and rules
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
CSS2 |
important |
Weight increasing |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
/*Comment*/ |
Comments |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
@import |
Import stylesheet |
4.0 |
0 |
1.0 |
Yes |
Yes |
7.0 |
Yes |
@charset |
Character set |
5.5 |
? |
1.0 |
0 |
No |
7.0 |
Yes |
@media |
Media-specific rules |
5.5 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
@page |
For paged media |
5.5 |
No |
No |
No |
No |
7.0 |
No |
CSS3 |
@namespace |
Namespace declaration |
No |
No |
1.0 |
Yes |
Yes |
8.0 |
No |
@font-face |
Define font |
5.5 |
No |
No |
No |
No |
No |
No |
Trident grammar and rule notes
- @font-face Only supports
Embedded OpenType (.eot) font format, does not understand the
format() identifier.
- !important !important doesn't
override rules defined later in the same declaration block prior to IE7.
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.
Presto grammar and rule notes
- @import Whilst Gecko, WebCore 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.
Selectors
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
Element selectors |
CSS2 |
* |
Universal |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E |
Element |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
E.class |
Class |
7.0 |
Buggy |
1.0 |
85 |
Yes |
7.0 |
Yes |
E#id |
ID |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
E |
Namespaced |
No |
No |
1.0 |
No |
Yes |
8.0 |
No |
Relationship selectors |
CSS2 |
E F |
Descendant |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
E > F |
Child |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E + F |
Direct adjacent |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
CSS3 |
E ~ F |
Indirect adjacent |
7.0 |
0.9 |
1.7 |
412 |
3.3.2 |
9.0 |
3.0 |
Attribute selectors |
CSS2 |
E[attr] |
Has |
7.0 |
0.9 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E[attr="value"] |
Equals |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
E[attr~="value"] |
Contains (space-separated) |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
E[attr|="value"] |
Contains (hyphen-separated) |
7.0 |
0.9 |
1.0 |
Yes |
Yes |
7.0 |
3.0 |
CSS3 |
E[attr^="value"] |
Begins with |
7.0 |
No |
1.0 |
Yes |
3.4 |
8.02 |
3.0 |
E[attr$="value"] |
Ends with |
7.0 |
No |
1.0 |
Yes |
3.4 |
9.0 |
3.0 |
E[attr*="value"] |
Contains substring |
7.0 |
No |
1.0 |
Yes |
3.4 |
9.0 |
3.0 |
E[ns|attr] |
Namespaced |
No |
No |
1.0 |
No |
3.4 |
9.0 |
No |
Pseudo-classes |
CSS2 |
E:link |
Unvisited hyperlink |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
E:visited |
Visited hyperlink |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
E:active |
Active |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
E:hover |
Mouseover |
7.0 |
0.9 |
1.0 |
419.3 |
Yes |
7.0 |
3.0 |
E:focus |
Focused |
No |
0 |
1.0 |
Yes |
Yes |
7.0 |
Yes |
E:first-child |
First child |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E:lang() |
Language |
No |
0 |
1.2 |
522 |
3.4 |
7.5 |
3.0 |
CSS3 |
E:root |
Root |
No |
0.1 |
1.0 |
85 |
3.4 |
9.5 |
No |
E:first-of-type |
First child of type |
No |
0.9 |
No |
522 |
3.4 |
9.5 |
No |
E:last-child |
Last child |
No |
0.9 |
1.0 |
Dangerous |
3.4 |
9.5 |
No |
E:last-of-type |
Last child of type |
No |
0.9 |
No |
Dangerous |
3.4 |
9.5 |
No |
E:only-child |
Only child |
No |
0.9 |
1.8 |
Dangerous |
3.4 |
9.5 |
No |
E:only-of-type |
Only child of type |
No |
0.9 |
No |
Dangerous |
3.4 |
9.5 |
No |
E:nth-child |
Nth child |
No |
0.9 |
No |
No |
3.4 |
9.5 |
No |
E:nth-last-child |
Nth last child |
No |
0.9 |
No |
No |
3.4 |
9.5 |
No |
E:nth-of-type |
Nth child of type |
No |
0.9 |
No |
No |
3.4 |
9.5 |
No |
E:nth-last-of-type |
Nth last child of type |
No |
0.9 |
No |
No |
3.4 |
9.5 |
No |
E:target |
Target |
No |
0.9 |
1.3 |
Partial |
3.4 |
9.5 |
No |
E:empty |
Empty |
No |
0.9 |
1.8 |
412 |
3.4 |
9.5 |
No |
E:not() |
Negation |
No |
0.9 |
1.0 |
85 |
3.4 |
9.5 |
No |
E:enabled |
Enabled state |
No |
0.9 |
1.8 |
522 |
3.4 |
9.0 |
No |
E:disabled |
Disabled state |
No |
0.9 |
1.8 |
522 |
3.4 |
9.0 |
No |
E:checked |
Checked state |
No |
No |
1.0 |
522 |
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 |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E:first-line |
First line |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E:before |
Before |
No |
No |
1.0 |
85 |
Yes |
7.0 |
3.0 |
E:after |
After |
No |
No |
1.0 |
85 |
Yes |
7.0 |
3.0 |
CSS3 |
E::before |
Double colon notation |
No |
No |
1.5 |
85 |
3.4 |
7.0 |
Yes |
E::after |
Double colon notation |
No |
No |
1.5 |
85 |
3.4 |
7.0 |
Yes |
E::first-letter |
Double colon notation |
No |
0.9 |
1.5 |
85 |
3.4 |
7.0 |
Yes |
E::first-line |
Double colon notation |
No |
0.9 |
1.5 |
85 |
3.4 |
7.0 |
Yes |
E::selection |
Selection |
No |
0.9 |
Experimental |
412 |
3.4 |
No |
No |
E::value |
Double colon notation |
No |
No |
No |
No |
No |
No |
No |
E::choices |
Double colon notation |
No |
No |
No |
No |
No |
No |
No |
E::repeat-item |
Double colon notation |
No |
No |
No |
No |
No |
No |
No |
E::repeat-index |
Double colon notation |
No |
No |
No |
No |
No |
No |
No |
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
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
[1]. 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.
Tasman selector notes
- :hover For anchor element only prior to
0.9.
- .one.two only
.two class
selector is taken into consideration.
WebCore selector notes
- :lang() Only detected when explicitly
present on element being tested, attribute not inherited.
- :target Style doesn't get applied when
navigating using back and forward buttons.
- :last-child & :last-of-type
will match all siblings, or all siblings of the same type, respectively.
- :only-child & :only-of-type
identical behaviour to
:first-child & :first-of-type .
- ::pseudo-element
Mistakenly also triggers on
::pseudo-class prior to
version 416.0.
Properties
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
Box model |
CSS2 |
margin |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
padding |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
width |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
height |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
float |
5.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
clear |
5.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
display |
Partial |
Partial |
Partial |
85 |
Yes |
7.0 |
Partial |
min-width |
7.0 |
0.9 |
1.0 |
416 |
Yes |
7.0 |
3.0 |
max-width |
7.0 |
0.9 |
1.0 |
416 |
Yes |
7.0 |
3.0 |
min-height |
7.0 |
0.9 |
1.7 |
416 |
3.3.2 |
7.0 |
3.0 |
max-height |
7.0 |
0.9 |
1.7 |
416 |
3.3.2 |
7.0 |
3.0 |
clip |
5.5 |
0.9 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
overflow |
7.0 |
0 |
1.0 |
85 |
3.2 |
7.0 |
3.0 |
visibility |
4.0 |
0.9 |
1.8 |
522 |
Partial |
Partial |
Partial |
CSS3 |
overflow-x |
7.0 |
No |
1.8 |
522 |
3.5.6 |
No |
No |
overflow-y |
7.0 |
No |
1.8 |
522 |
3.5.6 |
No |
No |
Borders |
CSS2 |
border |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-style |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-width |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-top |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-top-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-right |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-right-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-bottom |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-bottom-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-left |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-left-width |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-top-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-top-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-right-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-right-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-bottom-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-bottom-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-left-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
border-left-style |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
CSS3 |
border-radius |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
border-break |
No |
No |
No |
No |
No |
No |
No |
border-image |
No |
No |
No |
Experimental |
No |
No |
No |
box-shadow |
No |
No |
No |
Experimental |
No |
No |
No |
Line Layout |
CSS2 |
line-height |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
vertical-align |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Positioning |
CSS2 |
position |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
top |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
right |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
bottom |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
left |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
z-index |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
3.0 |
Generated and Replaced Content |
CSS2 |
quotes |
No |
0.9 |
1.8 |
No |
3.4 |
7.0 |
3.0 |
content |
No |
No |
Partial |
85 |
Yes |
7.0 |
3.0 |
counter-increment |
No |
No |
1.8 |
522 |
3.4 |
7.0 |
3.0 |
counter-reset |
No |
No |
1.8 |
522 |
3.4 |
7.0 |
3.0 |
Lists |
CSS2 |
list-style |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
list-style-image |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
list-style-position |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
list-style-type |
Partial |
0 |
1.0 |
85 |
3.4 |
8.0 |
3.0 |
Colors |
CSS2 |
color |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
color-profile |
No |
No |
No |
No |
No |
No |
No |
opacity |
nonstandard |
No |
1.7 |
125 |
Experimental |
9.0 |
No |
rendering-indent |
No |
No |
No |
No |
No |
No |
No |
Backgrounds |
CSS2 |
background |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
background-attachment |
7.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
background-color |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
background-image |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
background-position |
Partial |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
background-repeat |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
background (multiple) |
No |
No |
No |
312 |
3.5 |
No |
No |
background-clip |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
background-origin |
No |
No |
Experimental |
Experimental |
Experimental |
No |
No |
background-break |
No |
No |
No |
No |
No |
No |
No |
background-size |
No |
No |
No |
Experimental |
Experimental |
No |
No |
Fonts |
CSS2 |
font |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
font-family |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
font-size |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
font-style |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
font-variant |
4.0 |
0 |
1.0 |
125 |
Yes |
7.0 |
3.0 |
font-weight |
Buggy |
0 |
Partial |
Partial |
Yes |
Buggy |
Buggy |
CSS3 |
font-size-adjust |
No |
No |
Partial |
No |
No |
No |
No |
font-stretch |
No |
No |
No |
No |
No |
No |
Buggy |
font-effect |
No |
No |
No |
No |
No |
No |
No |
font-smooth |
No |
No |
No |
No |
No |
No |
No |
font-emphasize |
No |
No |
No |
No |
No |
No |
No |
Text |
CSS2 |
text-align |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Partial |
text-decoration |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
text-indent |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
text-transform |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
letter-spacing |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
word-spacing |
Partial |
Partial |
1.0 |
85 |
Yes |
7.0 |
Yes |
white-space |
Partial |
Partial |
Partial |
85 |
Yes |
Partial |
Yes |
direction |
5.0 |
0 |
1.0 |
85 |
Yes |
7.2 |
No |
unicode-bidi |
5.0 |
0 |
1.0 |
522 |
Yes |
7.2 |
No |
CSS3 |
text-shadow |
No |
No |
No |
Partial |
3.4 |
9.5 |
3.0.3 |
word-break |
Partial |
No |
No |
No |
No |
No |
No |
text-wrap |
No |
No |
No |
No |
No |
No |
No |
word-wrap |
5.0 |
No |
No |
85 |
No |
No |
No |
text-align-last |
Partial |
No |
No |
No |
No |
No |
No |
text-justify |
5.5 |
No |
No |
No |
No |
No |
No |
punctuation-trim |
No |
No |
No |
No |
No |
No |
No |
text-enphasis |
No |
No |
No |
No |
No |
No |
No |
text-outline |
No |
No |
No |
No |
No |
No |
No |
hanging-punctuation |
No |
No |
No |
No |
No |
No |
No |
Tables |
CSS2 |
border-collapse |
Partial |
0.9 |
1.0 |
125 |
Yes |
7.0 |
3.0 |
border-spacing |
No |
0.9 |
1.0 |
125 |
Yes |
7.0 |
3.0 |
caption-side |
No |
0.9 |
1.4 |
85 |
Yes |
7.0 |
CSS2.1 |
empty-cells |
Partial |
0.9 |
1.0 |
125 |
Yes |
7.0 |
Buggy |
table-layout |
5.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
3.0 |
User interface |
CSS2 |
cursor |
5.5 |
0 |
1.8 |
125 |
Yes |
7.0 |
3.0 |
outline |
No |
0 |
1.8 |
125 |
Yes |
7.0 |
3.0 |
outline-color |
No |
0 |
1.8 |
125 |
Yes |
7.0 |
3.0 |
outline-style |
No |
0 |
1.8 |
125 |
Yes |
7.0 |
3.0 |
outline-width |
No |
0 |
1.8 |
125 |
Yes |
7.0 |
3.0 |
CSS3 |
outline-offset |
No |
No |
1.8 |
125 |
No |
No |
No |
outline-radius |
No |
No |
Experimental |
No |
No |
No |
No |
box-sizing |
No |
0 |
Experimental |
522 |
3.3.2 |
7.0 |
No |
resize |
No |
No |
No |
522 |
No |
No |
No |
appearance |
No |
No |
Experimental |
Experimental |
No |
No |
No |
icon |
No |
No |
No |
No |
No |
No |
No |
nav-index |
No |
No |
No |
No |
No |
No |
No |
nav-up |
No |
No |
No |
No |
No |
No |
No |
nav-right |
No |
No |
No |
No |
No |
No |
No |
nav-down |
No |
No |
No |
No |
No |
No |
No |
nav-left |
No |
No |
No |
No |
No |
No |
No |
Paged media |
CSS2 |
marks |
No |
No |
No |
No |
No |
7.0 |
No |
orphans |
No |
No |
No |
312 |
3.5 |
7.0 |
No |
page-break-after |
4.0 |
No |
Partial |
Partial |
3.5 |
7.0 |
No |
page-break-before |
4.0 |
0 |
Partial |
Partial |
3.5 |
7.0 |
No |
page-break-inside |
No |
No |
No |
312 |
3.5 |
7.0 |
No |
widows |
No |
No |
No |
312 |
3.5 |
7.0 |
No |
CSS3 |
page |
No |
No |
No |
No |
No |
No |
No |
size |
No |
No |
No |
No |
No |
7.0 |
No |
image-orientation |
No |
No |
No |
No |
No |
No |
No |
fit |
No |
No |
No |
No |
No |
No |
No |
fit-position |
No |
No |
No |
No |
No |
No |
No |
Speech |
CSS3 |
voice-volume |
No |
No |
No |
No |
No |
7.6 |
No |
voice-balance |
7.6 |
speak |
7.6 |
pause |
7.6 |
pause-after |
7.6 |
pause-before |
7.6 |
rest |
No |
rest-before |
No |
rest-after |
No |
cue |
7.6 |
cue-after |
7.6 |
cue-before |
7.6 |
mark |
No |
mark-before |
No |
mark-after |
No |
voice-family |
7.6 |
voice-rate |
7.6 |
voice-pitch |
7.6 |
voice-pitch-range |
7.6 |
voice-stress |
7.6 |
voice-duration |
7.6 |
phonemes |
7.6 |
Media Queries |
CSS3 |
width |
No |
No |
No |
522 |
No |
9.0 |
No |
height |
522 |
9.0 |
device-width |
522 |
9.0 |
device-height |
522 |
9.0 |
device-aspect-ratio |
522 |
9.0 |
color |
522 |
9.0 |
color-index |
522 |
9.0 |
monochrome |
522 |
9.0 |
resolution |
No |
9.0 |
scan |
No |
No |
grid |
No |
9.0 |
Ruby characters |
CSS3 |
ruby-position |
5.0 |
0 |
No |
No |
No |
No |
No |
ruby-align |
5.0 |
0 |
ruby-overhang |
5.0 |
0 |
ruby-span |
No |
No |
Multi-column Layout |
CSS3 |
column-break-before |
No |
No |
Experimental |
Experimental |
No |
No |
No |
column-break-after |
Experimental |
Experimental |
column-break-inside |
Experimental |
Experimental |
column-count |
Experimental |
Experimental |
column-gap |
Experimental |
Experimental |
column-rule |
No |
No |
columns |
Experimental |
Experimental |
Trident property notes
- overflow
overflow:visible
is incorrectly supported prior to IE7.
- border-style
dotted is
rendered as dashed prior to IE7.
- display Only
none ,
block , inline , table-header-group , and
table-footer-group are supported prior to 7.0. In 5.5+,
inline-block is supported on elements that are naturally inline.
- position Prior to IE 7, fixed
positioning was not supported, IE 7 supports it in standards-compliant mode
only.
- background-attachment
Prior to IE 7,
fixed was allowed on the body
element only.
- background-position Fixed
positioning is not supported.
- font-weight Incorrect rendering when
value is 600
[2].
- text-decoration Optional
property
blink is not supported.
- white-space
nowrap is
supported in IE 5.5 and later. pre is supported in IE 6 and
later in standards-compliant mode. pre-line and pre-wrap
are not supported.
- list-style-type
decimal-leading-zero , lower-greek , lower-latin ,
upper-latin , upper-roman are not supported.
Gecko property notes
- display
run-in
[3] is not supported. inline-table
[4] and inline-block
[5] are supported in Gecko 1.9a2+.
- quotes Does not support nested quotes prior
to 1.8
[6].
- content Only works with
:before
and :after . Only support image <uri> .
<counter> does not work prior to 1.8
[7].
- background-position Gecko
versions prior to 1.7 implement the CSS2 syntax, not the proposed CSS2.1
expanded syntax.
- font-size-adjust Supported in
Windows only[8].
This problem will be fixed in the future Gecko 1.9.
- font-weight Only Regular and Bold
weights get used, even if Light or Heavy/Black faces are installed.
- white-space
pre-line is
not supported. pre-wrap is only supported experimentally as
-moz-pre-wrap ;.
- visibility
collapse is not
supported prior to 1.8.
- border-radius border curves are
circular, but the W3C specs
[9] define them as elliptical. Dashed curves are not available.
Short-cut definitions for
border-radius read "tl tr br bl"
instead of the W3C's "tr br bl tl". Interesting bugs:
[10]
[11]
[12]
- page-break-before;
page-break-after Only the
always and auto
values are supported.
WebCore property notes
- box-shadow The system font keywords
are not supported that allow designers to tailor presentation to the users
operating system environment.
- font The system font keywords are not
supported that allow designers to tailor presentation to the users
operating system environment.
- font-weight Only Regular and Bold
weights get used, even if Light or Heavy/Black faces are installed.
- page-break-before;
page-break-after Only the
always and auto
values are supported.
- text-decoration Optional
property
blink is not supported.
- white-space
pre-line
and pre-wrap from the proposed CSS2.1 draft are not supported.
- text-shadow Multiple shadows are not
supported.
- visibility
collapse is
not supported prior to 522.
KHTML property notes
- overflow Values
scroll and
auto are unsupported.
- page-break-before;
page-break-after Before 3.5 only the
always and
auto values were supported.
- text-decoration Optional property
blink is not supported.
- visibility All supported except for
collapse .
Presto property notes
- list-style-type The CSS2 values
are not supported prior to 8.0.
- counter-increment, counter-reset
Implemented the algorithm in REC CSS2.
- background-position Presto
versions prior to 8.0 implement the CSS2 syntax, not the proposed CSS2.1
expanded syntax.
- font-weight Incorrect rendering when
value is 600
[13].
- white-space
pre-line is
not supported.
- visibility All supported except for
collapse .
iCab property notes
- display
run-in is not
supported.
- text-align
justify is not
supported.
- font-stretch Simulated using
letter-spacing property.
- font-weight Incorrect (bold) rendering
when value is 500.
- visibility
collapse only
partial.
- caption-side
top and
bottom only which would comply with the proposed CSS2.1
elimination of the values: left and right .
- empty-cells Compresses hidden rows but
does not hide them completely.
Values and units
|
Trident |
Tasman |
Gecko |
WebCore |
KHTML |
Presto |
iCab |
Numbers |
CSS2 |
<number> |
A
floating-point number |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
<length> |
<number> followed by units |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
<percentage> |
<number> followed by % |
3.0 |
0 |
1.0 |
Imprecise |
Yes |
7.0 |
Yes |
<integer> |
An
integer |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
<angle> |
<number> angle-unit |
No |
No |
No |
Yes |
Yes |
No |
No |
<time> |
<number> time-unit |
Yes |
Yes |
<frequency> |
<number> frequency-unit |
Yes |
Yes |
Strings |
CSS2 |
<string> |
String |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
\code |
Unicode escapes |
6.0 |
0.9 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Shapes |
CSS2 |
rect() |
A
rectangle |
5.5 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
Functions |
CSS2 |
url() |
Uniform Resource Identifier |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS2 |
counter() |
|
No |
No |
? |
? |
? |
? |
? |
CSS3 |
attr() |
Attribute identifier |
No |
No |
1.0 |
Yes |
Yes |
7.0 |
Yes |
calc() |
|
No |
No |
? |
? |
? |
? |
? |
Colors |
CSS2 |
color names |
16 predefined
web
colors |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
#rrggbb or #rgb |
Hexadecimal notation |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
rgb(r,g,b) |
RGB notation |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
system colors |
28 predefined system colors
[14] |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
transparent |
Full
transparency |
4.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
rgba(r,g,b,a) |
RGBA notation |
No |
No |
1.9 |
522 |
Buggy |
No |
No |
hsl(h,s,l) |
HSL notation |
No |
No |
Yes |
522 |
3.5.5 |
No |
No |
hsla(h,s,l,a) |
HSLA notation |
No |
No |
1.9 |
522 |
3.5.5 |
No |
No |
Keywords |
CSS2 |
auto |
Automatically calculated |
6.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
inherit |
Inherited from the parents |
No |
? |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
initial |
|
No |
No |
Experimental |
No |
No |
No |
No |
Units |
CSS2 |
px |
Pixel |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
pt |
Point |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
pc |
Pica |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
cm |
Centimetre |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
mm |
Millimetre |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
in |
inch |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
em |
em |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
ex |
ex |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
% |
Percentage |
3.0 |
0 |
1.0 |
85 |
Yes |
7.0 |
Yes |
CSS3 |
deg |
Degree |
No |
No |
No |
Yes |
Yes |
No |
No |
grad |
Grad |
Yes |
Yes |
rad |
Radian |
Yes |
Yes |
ms |
Millisecond |
Yes |
Yes |
s |
Second |
Yes |
Yes |
Hz |
Hertz |
Yes |
Yes |
kHz |
Kilohertz |
Yes |
Yes |
turn |
Turn |
No |
No |
gd |
gd |
No |
No |
rem |
rem |
No |
No |
vw |
vw |
No |
No |
vh |
vh |
No |
No |
vm |
vm |
No |
No |
ch |
ch |
No |
No |
Trident value and unit notes
- auto In IE5 bug emulation mode (quirks
mode) does not work for
margin s, except table elements.
WebCore value and unit notes
- <percentage> Only uses the integer
component of <number>.
Presto value and unit notes
- attr() As all URI attribute values are
resolved to full URI, the value could be wrong if
attr() is
used on an attribute that contains relative URI.
- <number>
Quantization error for values greater than 20.47
[15] (not limited to em, try any non pixel units).
KHTML value and unit notes
- rgba() Because
opacity is not
supported, the opacity value of rgba() is ignored.
General notes
Gecko general notes
- -moz- All experimental selectors, properties
and values are prefixed with "-moz-", e.g.
::-moz-selection
instead of ::selection
[16].
WebCore general notes
- -webkit- All experimental selectors,
properties and values are prefixed with "-webkit-", e.g.
-webkit-box-shadow instead of box-shadow .
KHTML general notes
- -khtml- All experimental selectors,
properties and values are prefixed with "-khtml-", e.g.
-khtml-opacity
instead of opacity .
Presto general notes
- -xv- All new selectors, properties and
values introduced by CSS3 Speech Module are prefixed with "-xv-" (but not
found in CSS2 aural style sheets), e.g.
-xv-voice-rate instead
of voice-rate .
References
External links
CSS Compatibility Tables
-
WebDevout mostly covers Windows browsers. Extensive bug testing.
-
QuirksMode comprehensive but lacks latest versions.
-
Westciv abridged form of their retail guide.
-
MacEdition covers many Mac browsers, including rare and discontinued
ones.
-
Jesset simple table without bug details, includes WebTV.
-
Motohiko covers Firefox only. [Japanese]
Other links
Home | Up | Tableless web design | Comparison of layout engines (CSS)
Web Design & Development Guide, made by MultiMedia | Websites for sale
This guide is licensed under the GNU
Free Documentation License. It uses material from the Wikipedia.
| |