BrowseAtWork.com:   [ UP ]   [Manage cookies]

Comparison of layout engines (Cascading Style Sheets)

From Wikipedia, the free encyclopedia

Jump to: navigation, search

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.

Layout engine Used by
Amaya Amaya
Gecko All Mozilla software, including Firefox; SeaMonkey and Galeon; Camino; K-Meleon; Flock; also Epiphany-gecko
iCab iCab 1-3
KHTML Konqueror
Presto Opera; Opera Mobile, Nintendo DS & DSi Browser‎; Internet Channel
Prince Prince XML
Tasman Mac OS X versions of Internet Explorer and MSN
Trident Internet Explorer and other Internet Explorer shells (Microsoft Windows operating systems only)
WebKit Apple Safari; Google Chrome; Shiira; iCab 4; OmniWeb 5.5+; Epiphany; Adobe AIR; Midori; Adobe Dreamweaver CS4; Palm WebOS browser; Symbian S60 browser; OWB

[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/element when valid values are used.
No Indicates that the property/element is completely ignored.
Partial Indicates that the property/element is understood, but that not all values are supported. Supported values are implemented correctly.
Incorrect Indicates that the property/element is understood, but that it is not implemented correctly in all cases.
Experimental Indicates that the property/element is understood, but supported under an alternate name. May be incomplete or buggy.
Dropped Indicates that the property/element is no longer supported.
Nightly build Indicates that the property/element is supported to some extent in an experimental/nightly build. Future support is expected.
Depends Indicates that the property/element is supported only on certain platforms, or if certain settings are configured.

[edit] CSS version support

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 WebKit KHTML Presto iCab Prince XML
CSS1 7.0 0 1.0 85 Yes 1.0 Yes 1.0
CSS2.1 Mostly Partial Mostly Mostly Mostly Mostly Mostly Mostly
CSS3 Slight Slight Partial Partial Slight Partial Slight Slight

[edit] Grammar and rules

Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
CSS2 !important Weight increasing 7.0 0 1.0 85 Yes 1.0 Yes Yes
/*Comment*/ Comments 3.0 0 1.0 85 Yes 1.0 Yes Yes
@import Import stylesheet 8.0 0 1.0 Yes Yes 1.0 Yes 2.1
@charset Character set 5.5  ? 1.0 0 4.2.3 1.0 Yes Yes
@media Media-specific rules 5.5 0.9 1.0 Yes Yes 1.0 3.0 5.1
@page For paged media 8.0 No No[g 1] No[w 1] No 1.0 No 6.0
CSS3 @namespace Namespace declaration No No 1.0 Yes Yes 1.0 No 5.0
@font-face Define font 4.0 No 1.9.1 525 4.3 2.2 No 6.0
@phonetic-alphabet Phonetic pronunciation No No No No No No No No
Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML

[edit] Trident grammar and rule notes

  1. !important — Prior to 7.0, !important doesn't override rules defined later in the same declaration block.
  2. @import — Prior to 8.0, media type support is broken. For @import <URL> <MEDIA>, IE requests as the URL "<URL> <MEDIA>" and will include the url() token and/or quotes in the URL, too, if present. Cannot import more than 35 stylesheets.
  3. @font-face — Only supports Embedded OpenType (.eot) font format, does not understand the format() identifier.

[edit] Tasman grammar and rule notes

  1. @font-face — Versions 5.16 and 5.17 of Internet Explorer for Mac will download fonts specified but not use them. 5.23 no longer downloads the font.

[edit] Presto grammar and rule notes

  1. @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[spec 1]
CSS2 * Universal 7.0 0 1.0 85 Yes 1.0 3.0 Yes
E Element 4.0 0 1.0 85 Yes Yes Yes
E.class Class 7.0 Incorrect 1.0 85 Yes Yes Yes
E#id ID 4.0 0 1.0 85 Yes Yes Yes
CSS3 ns|E Namespaced No No 1.0 Yes Yes No Yes
Relationship selectors
CSS2 E F Descendant 4.0 0 1.0 85 Yes 1.0 Yes Yes
E > F Child 7.0 0 1.0 85 Yes 3.0 Yes
E + F Direct adjacent 7.0 0 1.0 85 Yes 3.0 Yes
CSS3 E ~ F Indirect adjacent 7.0 0.9 1.7 412 3.3.2 2.0 3.0 Yes
Attribute selectors
CSS2 E[attr] Has 7.0 0.9 1.0 85 Yes 1.0 3.0 Yes
E[attr="value"] Equals 7.0 0.9 1.0 Yes Yes 3.0 Yes
E[attr~="value"] Contains (space-separated) 7.0 0.9 1.0 Yes Yes 3.0 Yes
E[attr|="value"] Contains (hyphen-separated) 7.0 0.9 1.0 Yes Yes 3.0 Yes
CSS3 E[attr^="value"] Begins with 7.0 No 1.0 Yes 3.4 1.0 3.0 Yes
E[attr$="value"] Ends with 7.0 No 1.0 Yes 3.4 2.0 3.0 Yes
E[attr*="value"] Contains substring 7.0 No 1.0 Yes 3.4 3.0 Yes
E[ns|attr] Namespaced 7.0 No 1.0 Yes 3.4 No No
Pseudo-classes
CSS2 E:link Unvisited hyperlink 3.0 0 1.0 85 Yes 1.0 Yes 6.0
E:visited Visited hyperlink 3.0 0 1.0 85 Yes Yes Yes
E:active Active Incorrect 0 1.0 85 Yes Yes Yes
E:hover Mouseover 7.0 0.9 1.0 419.3 Yes 3.0 Yes
E:focus Focused 8.0 0 1.0 Yes Yes Yes Yes
E:first-child First child 7.0 0 1.0 85 Yes 3.0 Yes
E:lang() Language 8.0 0 1.2 525 3.4 3.0 Yes
@page:first First page 8.0 No No[g 1] No[w 1] No No Yes
@page:left Left page
@page:right Right page
CSS3 E:root Root 9.0 0.1 1.0 85 3.4 2.1 No Yes
E:not() Negation 0.9
E:empty Empty 1.8 412
E:first-of-type First child of type 1.9.1 525
E:last-child Last child 1.0
E:last-of-type Last child of type 1.9.1
E:only-child Only child 1.8
E:only-of-type Only child of type 1.9.1
E:nth-child Nth child 1.9.1
E:nth-last-child Nth last child 1.9.1
E:nth-of-type Nth child of type 1.9.1
E:nth-last-of-type Nth last child of type 1.9.1
E:target Target 1.3 Partial No
E:enabled Enabled state 1.8 2.0
E:disabled Disabled state 1.8
E:checked Checked state No 1.0
E:indeterminate Indeterminate state 0.9 1.9.2 522 No No
E:default Default No No 1.9 528+[w 2] 4.3 2.0
E:valid Valid 1.8 528+[w 3] No
E:invalid Invalid
E:in-range In range No[w 4]
E:out-of-range Out of range
E:required Required No[g 2] 528+[w 5]
E:optional Optional
E:read-only Read-only Experimental No Incorrect Incorrect
E:read-write Read and write
Pseudo-elements
CSS2 E:first-letter First letter Incorrect 0 1.0 85 Yes 1.0 3.0 5.0
E:first-line First line Partial No[r 1]
E:before Before 8.0 No 1.9.1 Partial Yes
E:after After
CSS3 E::before Double colon notation 9.0 No 1.9.1 Partial 3.4 1.0 Yes Yes
E::after Double colon notation
E::first-letter Double colon notation 0.9 1.5 85
E::first-line Double colon notation Partial No[r 1]
E::selection Selection Experimental 412 2.1 No No
Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML

[edit] General selector notes

  1. :read-only and :read-write — Both Presto and KHTML handle the case of the contenteditable attribute incorrectly.

[edit] Trident selector notes

  1. :active — In 8.0, the behaviour will not work if a child element is active and the actual element isn't.
  2. :active — Prior to 8.0, :active is only supported on anchor elements.
  3. :hover — Prior to 7.0, :hover is only supported on anchor elements.
  4. .one.two — Prior to 7.0, only .two class selector was taken into consideration.
  5. * — Prior to 7.0 this was treated as a single or no element.
  6. [attr] — Matches every td and th in a table when the attribute is colspan (regardless of whether any actually have a colspan attribute).[t 1] This may not actually be a bug, as ambiguity exists in the specification.[t 2]
  7. :first-letter, :first-line — In 6.0, combining :first-letter rules with others may be problematic.[t 3] In 8.0, rules with !important are ignored inside :first-line and :first-letter declarations.[t 4]

[edit] Tasman selector notes

  1. :hover — For anchor element only prior to 0.9.
  2. .one.two — only .two class selector is taken into consideration.

[edit] Gecko selector notes

  1. (:):before, (:):after — CSS2.0 behavior : some properties are unimplemented prior to 1.9.1.[g 3]

[edit] WebKit selector notes

  1. :lang() — Only detected when explicitly present on element being tested, attribute not inherited.
  2. (:):first-linetext-transform doesn't apply with this pseudo-element.[w 6]
  3. (:):before/after — some styles can't be applied to :before and :after pseudo-elements, such as animations and transitions.[w 7]

[edit] Presto selector notes

  1. :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[spec 2]
CSS2 margin Incorrect 0 1.0 85 Yes 1.0 3.0 Yes
padding 4.0 0 1.0 85 Yes 3.0 Yes
width 4.0 0 1.0 85 Yes 3.0 Yes
height 4.0 0 1.0 85 Yes 3.0 Yes
float 5.0 0 1.0 85 Yes 3.0 Yes
clear 5.0 0 1.0 85 Yes Yes Yes
display 8.0 Partial Partial 85 Yes Partial Yes
min-width 7.0 0.9 1.0 416 Yes 3.0 5.0
max-width 7.0 0.9 1.0 416 Yes 3.0 5.0
min-height 7.0 0.9 1.7 416 3.3.2 3.0 5.0
max-height 7.0 0.9 1.7 416 3.3.2 3.0 5.0
clip 8.0 0.9 1.0 85 Yes 3.0 5.0
overflow Incorrect 0 1.0 85 3.2 3.0 5.0
visibility Incorrect 0.9 1.8 Partial Partial 2.5 Partial Partial
CSS3 overflow-x Incorrect No 1.8 525 3.5.6 2.1 No 5.0
overflow-y
Borders[spec 3]
CSS2 border 4.0 0 1.0 85 Yes 1.0 3.0 3.0
border-color 7.0
border-style 8.0
border-width 4.0
border-top 5.5
border-right
border-bottom
border-left
CSS3 border-radius 9.0[t 5] No Experimental Experimental (528+)[w 8] Experimental 2.5 No 6.0
border-image No Experimental No No
box-shadow No
box-decoration-break No No No No
column reminder Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Line Layout[spec 4]
CSS2 line-height 4.0 0 1.0 85 Yes 1.0 Yes 5.0
vertical-align 8.0 0 1.0 85 Yes 3.0 6.0
Positioning
CSS2 position 7.0 0 1.0 85 Yes 1.0 3.0 5.0
top 8.0 Partial 1.0 85 Yes 3.0 6.0
right 8.0 Partial 1.0 85 Yes 3.0 6.0
bottom 8.0 Partial 1.0 85 Yes 3.0 6.0
left 8.0 Partial 1.0 85 Yes 3.0 6.0
z-index 8.0 Partial 1.9 85 Yes 3.0 6.0
Generated and Replaced Content[spec 5]
CSS2 quotes 8.0 0.9 1.8 No[w 9] 3.4 1.0 3.0 No
content Partial No 1.9 Partial Yes Partial 3.0 Partial
counter-increment 8.0 No 1.8 525 3.4 1.0 3.0 5.0
counter-reset 8.0 No 1.8 525 3.4 3.0 5.0
CSS3 content Partial No Partial Partial ? Partial ? Partial
Lists[spec 6]
CSS2 list-style 4.0 0 1.0 85 Yes 1.0 3.0 6.0
list-style-image 4.0 0 1.0 85 Yes 3.0 6.0
list-style-position 4.0 0 1.0 85 Yes 3.0 6.0
list-style-type 8.0 0 1.0 85 3.4 3.0 Partial
Colors[spec 7]
CSS2 color 3.0 0 1.0 85 Yes 1.0 Yes 5.0
CSS3 opacity 9.0[t 5] No 1.7 125 4.0 2.0 No 6.0
column reminder Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Backgrounds[spec 3]
CSS2 background 4.0 0 1.0 85 Yes 1.0 Yes 6.0
background-attachment 7.0 Yes 5.0
background-color 4.0 3.0 3.1
background-image 8.0 Yes 6.0
background-position 8.0 Yes 3.1
background-repeat 4.0 Yes 3.1
CSS3 background (multiple) No No 1.9.2 312 3.5 2.5 No No
background-clip Experimental Experimental Experimental
background-origin
background-size
Fonts[spec 8]
CSS2 font 4.0 0 1.0 85 Yes Incorrect Yes Yes
font-family 4.0 0 1.0 85 Yes 1.0 Yes Yes
font-size 3.0 0 1.0 85 Yes Yes 3.1
font-style 4.0 0 1.0 85 Yes Yes Yes
font-variant 4.0 0 1.0 125 Yes 3.0 Yes
font-weight 8.0 0 Partial Partial Yes Incorrect Incorrect Yes
CSS3 font-size-adjust No No 1.9 No[w 10] No No No No
font-stretch No No No[g 4] No[w 11] No No Incorrect 6.0
column reminder Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Text[spec 9]
CSS2 text-align 4.0 0 1.0 85 Yes 1.0 Partial Yes
text-decoration Yes 0 Incorrect Incorrect Yes 3.0 3.1
text-indent 3.0 0 1.0 85 Yes Yes Yes
text-transform 4.0 0 1.0 85 Yes Yes 6.0
letter-spacing 4.0 0 1.0 85 Yes Yes 5.
word-spacing 8.0 Partial 1.0 85 Yes Yes 5.0
white-space 8.0 Partial 1.9.1 522 Yes 2.1 Yes 6.0
direction 5.0 0 1.0 85 Yes 1.0 No 7.0
unicode-bidi 5.0 0 1.0 525 Yes No 7.0
CSS3 text-shadow No No 1.9.1 Yes 3.4 2.1 3.0.3 No
text-overflow Partial No No[g 5] Partial 3.5.6 Experimental No No
word-break Partial No No[g 6] No No No No No
text-wrap No No No No No No No No
word-wrap 5.0 No 1.9.1 85 4.3 2.5 No No
text-align-last Partial No No No No No No Partial
text-justify 5.5 No No[g 7] No No No No 6.0
punctuation-trim No No No No No No No No
text-emphasis No No No No No No No No
text-outline No No No[g 8] No No No No No
hanging-punctuation No No No No[w 12] No No No No
Tables
CSS2 border-collapse 8.0 0.9 1.0 125 Yes 1.0 3.0 5.1
border-spacing 8.0 0.9 1.0 125 Yes 3.0 6.0
caption-side 8.0 0.9 1.4 85 Yes CSS2.1 5.0
empty-cells 8.0 0.9 1.0 125 Yes Incorrect 5.0
table-layout 5.0 0 1.0 85 Yes 3.0 6.0
User interface[spec 10]
CSS2 cursor 5.5 0 1.8 125 Yes Partial 3.0 Yes
outline 8.0 0 1.8 125 Yes 1.0 3.0 No
outline-color 8.0 0 1.8 125 Yes 3.0 No
outline-style 8.0 0 1.8 125 Yes 3.0 No
outline-width 8.0 0 1.8 125 Yes 3.0 No
CSS3 outline-offset No No 1.8 125 3.5 2.1 No No
outline-radius No No Experimental No[w 13] No No No No
box-sizing 8.0 0 Experimental Experimental 3.3.2 1.0 No 7.0
resize No No No[g 9] 525 No No No No
appearance No No Experimental Experimental No No No No
icon No No No No No No No No
nav-index No No No No No 2.1 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
column reminder Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Paged media[spec 11]
CSS2 page-break-before 4.0 0 Partial Partial 3.5 1.0 No 6.0
page-break-after No No 6.0
page-break-inside 8.0 No[g 10] 312 No 6.0
orphans No[g 11] No 6.0
widows No 6.0
CSS3 page No No No No No No No Yes
size No No No No[w 14] No 1.0 No 6.0
image-orientation No No No No No No No No
image-fit No No No No No No No No
image-position No No No No No No No No
Speech[spec 12]
CSS2 cue No No No[g 12] No No 1.0 No No
cue-after
cue-before
pause
pause-after
pause-before
speak
voice-family
CSS3 voice-balance Experimental
voice-duration
voice-pitch
voice-pitch-range
voice-rate
voice-stress
voice-volume
interpret-as
phonemes
rest No
rest-after
rest-before
mark
mark-after
mark-before
column reminder Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Media Queries[spec 13]
CSS3 width No No 1.9.1 525 4.1 2.0 No  ?
height  ?
device-width  ?
device-height  ?
device-aspect-ratio  ?
color 2.5  ?
color-index  ?
monochrome  ?
resolution No  ?
orientation 4.2.1 No  ?
aspect-ratio 2.1  ?
grid No 4.1 2.5  ?
scan  ?
Ruby characters[spec 14]
CSS3 ruby-position 5.0 0 No[g 13] No No No No No
ruby-align
ruby-overhang
ruby-span No No
Multi-column Layout[spec 15]
CSS3 column-count No No Experimental Experimental No No No Yes
column-width
column-gap
column-rule
columns No[g 14]
column-break-before No 6.0
column-break-after
column-break-inside
column-fill No
column-span No[w 15] No
Animation[spec 16]
CSS3
animation No No No[g 15] Experimental No No No No
animation-delay
animation-direction
animation-duration
animation-iteration-count
animation-name
animation-play-state
animation-timing-function
2D Transforms[spec 17]
CSS3
transform No No Experimental Experimental No Experimental No No
transform-origin
3D Transforms[spec 18]
CSS3
transform No No No[g 16] Experimental No No No No
transform-origin
transform-style
perspective
perspective-origin
backface-visibility
Transitions[spec 19]
CSS3
transition-property No No 1.9.3 (Experimental)[g 17] Experimental No Experimental No No
transition-duration
transition-timing-function
transition-delay
transition
Flexible Box Layout[spec 20]
CSS3
box-align No No Experimental Experimental No No No No
box-direction
box-flex
box-flex-group
box-lines
box-ordinal-group
box-orient
box-pack
Marquee[spec 21]
CSS3
marquee-direction No No No No No No No No
marquee-play-count
marquee-speed
marquee-style
overflow-style

[edit] Trident property notes

  1. margininherit inherits the computation and recomputes it instead of inheriting the computed value.[t 6]
  2. display — Prior to 7.0, only none, block, inline, table-header-group, and table-footer-group are fully supported. Prior to 8.0, run-in and table are not supported, while inline-block is only supported on elements that are naturally inline.
  3. overflow — Prior to 7.0, overflow: visible; is incorrectly supported. In 8.0, scroll makes the element's height equal to its max-height even if the content isn't that tall.[t 7]
  4. visibility — Prior to 8.0, visibility: collapse; is not supported. In 8.0, inline elements with visibility: visible; inside block elements with visibility: hidden; are not visible.[t 8]
  5. content — In 8.0, computed attr() values are not updated when the attribute changes.[t 9]
  6. border-color — Prior to 7.0, transparent is not supported.
  7. border-style — Prior to 8.0, hidden is not supported.
  8. border-style — Prior to 7.0, dotted is rendered as dashed.
  9. box-shadow — Not supported. Trident supports similar functionality since 5.5 using the proprietary Shadow[t 10] and DropShadow[t 11] filters.
  10. position — Prior to 7.0, fixed positioning was not supported. 7.0 and later support it in standards-compliant mode only.
  11. z-index — Prior to 8.0, z-index is only partially supported.[t 12] In 8.0, floating point values are accepted in addition to integers.[t 13]
  12. list-style-type — Prior to 8.0, armenian, decimal-leading-zero, georgian, lower-greek, lower-latin, upper-latin are not supported.
  13. opacity — Prior to 9.0, Trident supported a proprietary alternative.[t 14]
  14. background-image — Prior to 8.0, background images are badly positioned in some cases.[t 15][t 16]
  15. background-attachment — Prior to 7.0, fixed was allowed on the body element only.
  16. background-position — Prior to 8.0, fixed positioning is not supported.
  17. font-weight — Prior to 8.0, incorrect rendering when value is 600.[t 17]
  18. text-align — In 8.0, text-align isn't inherited by :before and :after pseudo-elements.[t 18]
  19. white-space — Prior to 6.0, pre is not supported. Prior to 8.0, white-space is only partially supported; pre-line and pre-wrap are not supported.[t 19]
  20. cursor — Does not fail on non-prefixed vendor extensions.

[edit] Gecko property notes

  1. displayrun-in is unsupported.[g 18] Prior to 1.9, inline-table[g 19] and inline-block[g 20] were unsupported.
  2. z-index — Negatives values are badly supported prior to 1.9.
  3. quotes — Does not support nested quotes prior to 1.8.[g 21]
  4. contentnone value is unsupported prior to 1.9. This property also fails on any normal (non-pseudo-) elements, which it must support according to the CSS3 "Generated and Replaced Content Module" spec.
  5. background-position — Versions prior to 1.7 implement the CSS2 syntax, not the proposed CSS2.1 expanded syntax.
  6. font-size-adjust — Prior to 1.9, supported on Windows only.
  7. font-weight — Only Regular and Bold weights get used, even if Light or Heavy/Black faces are installed.
  8. white-spacepre-line is not supported prior to 1.9.1. Prior to 1.9, pre-wrap was only supported experimentally as -moz-pre-wrap.
  9. visibilitycollapse is unsupported prior to 1.8.
  10. border-radius — Prior to 1.9.1, border curves are circular, not elliptical as specified by the current CSS3 draft. Short-cut definitions for border-radius read "tl tr br bl" instead of the W3C's "tr br bl tl". When the border style is dotted or dashed, curves are rendered as solid instead.[g 22]
  11. page-break-before; page-break-after — Only the always and auto values are supported.

[edit] WebKit property notes

  1. font — The system font keywords that allow designers to tailor presentation to the user's operating system environment are unsupported.
  2. font-weight — Only Regular and Bold weights get used, even if Light or Heavy/Black faces are installed.
  3. page-break-before; page-break-after — Only the always and auto values are supported.
  4. white-space — Prior to 522, pre-line and pre-wrap are unsupported.
  5. visibilitycollapse is unsupported prior to 522. Its implementation has the same effect as hidden and is therefore not compliant.[w 16]
  6. content — The none, open-quote, close-quote, no-open-quote, no-close-quote and normal values is unsupported. This property also fails on any normal (non-pseudo-) elements, which it must support according to the CSS3 "Generated and Replaced Content Module" spec.
  7. font-size — The font-size property does not always accept the value 0, in "font-size: 0px" the text is still visible.

[edit] KHTML property notes

  1. overflow — Values scroll and auto are unsupported.
  2. page-break-before; page-break-after — Before 3.5 only the always and auto values were supported.
  3. visibility — All properties are supported, but the implementation of collapse has the same effect as hidden and is therefore not compliant.

[edit] Presto property notes

  1. counter-increment, counter-reset — Implemented the algorithm in REC CSS2.
  2. background-position — Presto versions prior to Opera 8.0 implement the CSS2 syntax, not the proposed CSS2.1 expanded syntax.
  3. font-weight — Incorrect rendering when value is 600. Renders the text in a compatibility mode for websites made for Trident.
  4. visibility — Prior to 2.5, the value collapse is unsupported in table columns. On rows, it had the same effect as hidden and was therefore not compliant.
  5. cursorcursor is ignored with dynamic pseudo-classes and custom cursors are unsupported.
  6. content — The none value is unsupported.
  7. fontinherit should not be allowed together with a font-size value. This should not be parsed, but it's currently done in Opera.

[edit] iCab property notes

  1. displayrun-in is not supported.
  2. text-alignjustify is not supported.
  3. font-stretch — Simulated using letter-spacing property.
  4. font-weight — Incorrect (bold) rendering when value is 500.
  5. visibilitycollapse only partial.
  6. caption-sidetop and bottom only which would comply with the proposed CSS2.1 elimination of the values: left and right.
  7. empty-cells — Compresses hidden rows but does not hide them completely.

[edit] Prince XML property notes

  1. visibility — The value collapse is unsupported.[r 1]
  2. list-style — The values armenian and georgian are unsupported.[r 1]
  3. content — The values open-quote and close-quote are unsupported.[r 1]

[edit] General property notes

  1. text-decorationunderline is drawn across inline replaced elements (e.g. images) in Gecko or Webkit.

[edit] Values and units

Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
Numbers[spec 22]
CSS2 <number> A floating-point number 3.0 0 1.0 85 Yes 1.0 Yes 6.0
<length> <number> followed by units
<percentage> <number> followed by %
<integer> An integer
CSS3 <angle> <number> angle-unit No No Partial Partial Partial Partial No No
<time> <number> time-unit 1.9.3[g 17] Yes Yes 2.5
<frequency> <number> frequency-unit
<fraction> Remaining space No No No No
Strings
CSS2 <string> String 3.0 0 1.0 85 Yes 1.0 Yes Yes
\code Unicode escapes 6.0 0.9
Shapes
CSS2 rect() A rectangle 8.0 0 1.0 85 Yes 1.0 Yes Yes
Functions
CSS2 url() Uniform Resource Identifier 3.0 0 1.0 85 Yes 1.0 Yes Yes
counter() 8.0 No  ?
attr() Attribute identifier Yes
CSS3 calc() No No No[g 23] No[w 17] No No No No
Colors
CSS2 HTML4 color keywords 16 predefined web colors 3.0 0 1.0 85 Yes 1.0 Yes Yes
#rrggbb or #rgb Hexadecimal notation
rgb(r,g,b) RGB notation 4.0
system colors[spec 23] 28 predefined system colors 3.0
CSS3 SVG color keywords Partial ? Yes Yes Yes Yes ? ?
currentColor The value of the ‘color’ property. No No 1.8 528 Yes 2.1 ? ?
rgba(r,g,b,a) RGBA notation 9.0[t 5] 1.9 525 4.0 2.2 No 6.0
hsl(h,s,l) HSL notation No 1.5 3.5.5 2.1 No
hsla(h,s,l,a) HSLA notation 1.9 3.5.5 2.2
transparent Full transparency Partial 0 1.9 4.0 Partial Partial Partial
Keywords
CSS2 auto Automatically calculated 6.0 0 1.0 85 Yes 1.0 Yes Yes
inherit Inherited from the parent 8.0  ?
CSS3 initial No No Experimental 125 No No No No
Units
CSS2 px Pixel 3.0 0 1.0 85 Yes 1.0 Yes Yes
pt Point
pc Pica
cm Centimetre
mm Millimetre
in inch
em em
ex ex
% Percentage
CSS3 deg Degree No No 1.9.1 Yes Yes 2.5 No No
grad Grad
rad Radian
turn turn No No No No
ms Millisecond 1.9.3[g 24] Yes Yes 2.5
s Second
Hz Hertz
kHz Kilohertz
dpi Dots per inch No No 4.1 No
dpcm Dots per centimetre No No 4.1 No
dppx Dots per pixel-unit No No ? No
gd Cells in the layout-grid No No No No
fr Remaining space in a series of length values No No No No
rem the font size of the root element 1.9.2 No No No
vw the viewport's width No[g 25] No[w 18] No No
vh the viewport's height
vm the viewport's height or width, whichever is smaller of the two
ch the width of the "0" (ZERO, U+0030) glyph found in the font for the font size used to render. 1.9.1 No No No
Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML

[edit] General value and unit notes

  1. transparent

    CSS1 introduced the ‘transparent’ value for the background-color property. CSS2 allowed border-color to also accept the ‘transparent’ value. The Open eBook(tm) Publication Structure 1.0.1 [OEB101] extended the ‘color’ property to also accept the ‘transparent’ keyword. CSS3 extends the color value to include the ‘transparent’ keyword to allow its use with all properties that accept a <color> value. This simplifies the definition of those properties in CSS3.

  2. <angle> — The turn unit is unsupported.

[edit] Trident value and unit notes

  1. rect() — Prior to 8.0, rect() was not supported with the correct syntax using commas.
  2. auto — In quirks mode (IE5 emulation mode), auto does not work for margins, except table elements.
  3. transparent — Using transparent in the color property will render the text as black.
  4. transparent — Prior to 7.0, transparent is not supported on borders (shows as solid black) and is ignored on PNG images.

[edit] Gecko value and unit notes

  1. <ch> — Prior to version 1.9.1, used the width of the "M" glyph instead of the width of the "0" glyph.[g 26]

[edit] Presto value and unit notes

  1. <number> — Prior to 2.1, there existed a quantization error for values greater than 20.47 (not limited to em, try any non-pixel units).[p 1]
  2. transparent — Keyword is ignored when used with the outline-color property. Prior to version 2.2, it was also ignored when used with the color and text-shadow properties.

[edit] Image Values

Trident Tasman Gecko WebKit KHTML Presto iCab Prince XML
CSS2 <url>[spec 24] Image types 3.0 0 1.0 85 Yes 1.0 Yes Yes
CSS3 <sprite> No No No No No No No No
<image-list>
<linear-gradient> Experimental Experimental
<radial-gradient>
linear-gradient() Color gradients
radial-gradient()
repeating-linear-gradient() No
repeating-radial-gradient()

[edit] General notes

[edit] Trident general notes

  1. -ms- — All experimental properties are prefixed with "-ms-", e.g. -ms-interpolation-mode instead of interpolation-mode.

[edit] Gecko general notes

  1. -moz- — All experimental selectors, properties and values are prefixed with "-moz-", e.g. ::-moz-selection instead of ::selection.

[edit] WebKit general notes

  1. -webkit- — All experimental selectors, properties and values are prefixed with "-webkit-", e.g. -webkit-box-shadow instead of box-shadow.

[edit] KHTML general notes

  1. -khtml- — All experimental selectors, properties and values are prefixed with "-khtml-", e.g. -khtml-opacity instead of opacity.

[edit] Presto general notes

  1. -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.
  2. -o- — All experimental properties are prefixed with "-o-", e.g. -o-transition-property instead of transition-property.

[edit] DOM equivalents to vendor-specific styles

  1. The DOM properties corresponding to vendor-specific experimental CSS properties are prefixed with the vendor-prefix, without any hyphens, and with first letter capitalised, e.g. element.style.MozBorderRadius corresponding to the -moz-border-radius property, or element.style.OTransform corresponding to the -o-transform property.

[edit] References

[edit] Specifications

  1. ^ Selectors Level 3, W3C, http://www.w3.org/TR/css3-selectors/ 
  2. ^ CSS basic box model, W3C, http://www.w3.org/TR/css3-box/ 
  3. ^ a b CSS Backgrounds and Borders Module Level 3, W3C, http://www.w3.org/TR/css3-background/ 
  4. ^ CSS3 module: line, W3C, http://www.w3.org/TR/css3-linebox/ 
  5. ^ CSS3 Generated and Replaced Content Module, W3C, http://www.w3.org/TR/css3-content/ 
  6. ^ CSS3 module: Lists, W3C, http://www.w3.org/TR/css3-lists/ 
  7. ^ CSS Color Module Level 3, W3C, http://www.w3.org/TR/css3-color/ 
  8. ^ CSS Fonts Module Level 3, W3C, http://www.w3.org/TR/css3-fonts/ 
  9. ^ CSS Text Level 3, W3C, http://www.w3.org/TR/css3-text/ 
  10. ^ CSS3 Basic User Interface Module, W3C, http://www.w3.org/TR/css3-ui/ 
  11. ^ CSS3 Module: Paged Media, W3C, http://www.w3.org/TR/css3-page/ 
  12. ^ CSS3 Speech Module, W3C, http://www.w3.org/TR/css3-speech/ 
  13. ^ Media Queries, W3C, http://www.w3.org/TR/css3-mediaqueries/ 
  14. ^ CSS3 Ruby Module, W3C, http://www.w3.org/TR/css3-ruby/ 
  15. ^ CSS Multi-column Layout Module, W3C, http://www.w3.org/TR/css3-multicol/ 
  16. ^ CSS Animations Module Level 3, W3C, http://www.w3.org/TR/css3-animations/ 
  17. ^ CSS 2D Transforms Module Level 3, W3C, http://www.w3.org/TR/css3-2d-transforms/ 
  18. ^ CSS 3D Transforms Module Level 3, W3C, http://www.w3.org/TR/css3-3d-transforms/ 
  19. ^ CSS Transitions Module Level 3, W3C, http://www.w3.org/TR/css3-transitions/ 
  20. ^ Flexible Box Layout Module, W3C, http://www.w3.org/TR/css3-flexbox/ 
  21. ^ CSS Marquee Module Level 3, W3C, http://www.w3.org/TR/css3-marquee/ 
  22. ^ CSS3 Values and Units, W3C, http://www.w3.org/TR/css3-values/ 
  23. ^ System Colors, W3C, http://www.w3.org/TR/CSS21/ui.html#system-colors 
  24. ^ CSS Image Values Module Level 3, W3C, http://dev.w3.org/csswg/css3-images/ 

[edit] Trident references

  1. ^ Hopkins, James, Attribute selector (which matches the attribute, 'colspan' for TD and TH elements) matches every TD and TH element, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=446817 
  2. ^ Hammond, David, Comment on "IE 8 CSS 2.1 support results", http://www.webdevout.net/tidings/2009/03/23/ie-8-css-21-support-results/#comment-4168 
  3. ^ :first-letter Ignore Bug, hasLayout.net, http://haslayout.net/css/-first-letter-Ignore-Bug 
  4. ^ Hopkins, James, Declaration which includes !important keyword is ignored when used within a :first-letter or :first-line rule, https://connect.microsoft.com/IE/feedback/details/478138/declaration-which-includes-important-keyword-is-ignored-when-used-within-a-first-letter-or-first-line-rule 
  5. ^ a b c Internet Explorer 9 Preview Builds, Microsoft, http://msdn.microsoft.com/en-us/ie/ff468705.aspx 
  6. ^ Talbot, Inherited margin with inherit keyword: the computed value's parent should be inherited, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=344787 
  7. ^ Groot, Sven, Overflow: scroll causes element to always have its max-height, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=408759 
  8. ^ Hopkins, James, visibility:visible applied to inline element doesn’t override inherited visibility:hidden value applied to it’s block-level parent, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=442805 
  9. ^ Content: attr(x) isn't updated when the attribute's value change, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=434925 
  10. ^ Shadow Filter, Microsoft, http://msdn.microsoft.com/en-us/library/ms533086(VS.85).aspx 
  11. ^ DropShadow Filter, Microsoft, http://msdn.microsoft.com/en-us/library/ms532985(VS.85).aspx 
  12. ^ Positioning, http://msdn.microsoft.com/en-us/library/cc351024(VS.85).aspx#positioning 
  13. ^ Hopkins, James, Illegal parsing of a z-index decimal value, instead of an integer, https://connect.microsoft.com/IE/feedback/details/386914/illegal-parsing-of-a-z-index-decimal-value-instead-of-an-integer 
  14. ^ Alpha Filter, Microsoft, http://msdn.microsoft.com/en-us/library/ms532967(VS.85).aspx 
  15. ^ IE7-/Escaping Background Image Bug - Demo 1, http://css-class.com/test/bugs/ie/escaping-background-image-bug1.htm 
  16. ^ IE7-/Escaping Background Image Bug - Demo 2, http://css-class.com/test/bugs/ie/escaping-background-image-bug2.htm 
  17. ^ Koch, Peter-Paul, IE Windows and Opera - font-weight: 600 vs. bold, QuirksMode, http://www.quirksmode.org/css/tests/iewin_fontweight.html 
  18. ^ Hopkins, James, 'text-align' value isn't inherited by ':before' and ':after' pseudo elements, https://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=454985 
  19. ^ Font and Text, Microsoft, http://msdn.microsoft.com/en-us/library/cc351024#font 

[edit] Gecko references

  1. ^ a b Bug 115199 - @page in CSS2 not implemented, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=115199 
  2. ^ Bug 506554 - Implement the CSS3 pseudo-classes :required and :optional, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=506554 
  3. ^ Bug 237119 - property 'display' is ignored for generated content, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=237119 
  4. ^ Bug 3512 - (font-stretch) Implement font-stretch property, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=3512 
  5. ^ Bug 312156 - implement text-overflow: ellipsis from CSS3 text, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=312156 
  6. ^ Bug 249159 - implement 'word-break' properties of CSS3, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=249159 
  7. ^ Bug 276079 - Implement text-justify property(but 'auto', 'inter-word', 'inter-ideograph' and 'distribute' only), Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=276079 
  8. ^ Bug 470547 - CSS3 text-outline not supported, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=470547 
  9. ^ Bug 442228 - Implement CSS3 'resize' property, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=442228 
  10. ^ Bug 132035 - Implement missing page-break-* CSS2.1 features, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=132035 
  11. ^ Bug 137367 - Implement orphans and widows, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=137367 
  12. ^ Bug 47159 - Support css3-speech (previously Aural Style Sheet) properties in getComputedStyle, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=47159 
  13. ^ Bug 256274 - Implement CSS ruby module, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=256274 
  14. ^ Bug 446569 - Implement CSS3 columns shorthand, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=446569 
  15. ^ Bug 435442 - Implement Webkit's CSS Animation proposal, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=435442 
  16. ^ Bug 505115 - CSS3 3D-Transforms, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=505115 
  17. ^ a b Bug 435441 - get CSS transitions complete enough to ship, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=537142 
  18. ^ Bug 2056 - display: run-in not implemented, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=2056 
  19. ^ Bug 18217 - display: inline-table not implemented, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=18217 
  20. ^ Bug 9458 - (inline-block) Implement inline-block in layout, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=9458 
  21. ^ New Web Developer Features in Deer Park Alpha 1, Mozilla, http://www.mozilla.org/projects/deerpark/new-web-dev-features.html 
  22. ^ Bug 382721 - Dotted/dashed -moz-border-radiused corners are rendered as solid, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=382721 
  23. ^ Bug 363249 - implement css3-values calc(), Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=363249 
  24. ^ Bug 435441 - Implement Webkit's CSS Transitions proposal, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=435441 
  25. ^ Bug 503720 - Implement vw/vh/vm (viewport sizes) from CSS 3 Values and Units, Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=503720 
  26. ^ Bug 282126 - What to do about the 'ch' length unit? (Mozilla vendor specific), Mozilla, https://bugzilla.mozilla.org/show_bug.cgi?id=282126 

[edit] Webkit references

  1. ^ a b Bug 15548 - Support CSS3 Paged Media (@page), Webkit, https://bugs.webkit.org/show_bug.cgi?id=15548 
  2. ^ Bug 27458 - Support :default HTML5 CSS selector, Webkit, https://bugs.webkit.org/show_bug.cgi?id=27458 
  3. ^ Bug 27357 - Support :valid/:invalid CSS selectors, Webkit, https://bugs.webkit.org/show_bug.cgi?id=27357 
  4. ^ Bug 29071 - Support for :in-range and :out-of-range CSS selectors, Webkit, https://bugs.webkit.org/show_bug.cgi?id=29071 
  5. ^ Bug 25551 - Support for HTML5 Forms "required" attribute, Webkit, https://bugs.webkit.org/show_bug.cgi?id=25551 
  6. ^ Bug 3409 - CSS1: Safari ignores "text-transform" attribute in "first-line" CSS rules, Webkit, https://bugs.webkit.org/show_bug.cgi?id=3409 
  7. ^ Bug 23209 - [RFE] CSS Generated Content does not transition, Webkit, https://bugs.webkit.org/show_bug.cgi?id=23209 
  8. ^ Bug 27578 - Drop the prefix from the border-radius properties, Webkit, https://bugs.webkit.org/show_bug.cgi?id=27578 
  9. ^ Bug 3234 - CSS2: Implement better quote support (for the q tag), Webkit, https://bugs.webkit.org/show_bug.cgi?id=3234 
  10. ^ Bug 15257 - Support CSS 3 font-size-adjust, Webkit, https://bugs.webkit.org/show_bug.cgi?id=15257 
  11. ^ Bug 12530 - CSS3: Support the font-stretch property, Webkit, https://bugs.webkit.org/show_bug.cgi?id=12530 
  12. ^ Bug 18109 - Implement hanging punctuation, Webkit, https://bugs.webkit.org/show_bug.cgi?id=18109 
  13. ^ Bug 25293 - We should implement outline-radius:, Webkit, https://bugs.webkit.org/show_bug.cgi?id=25293 
  14. ^ Bug 10894 - CSS "size" property is not supported, Webkit, https://bugs.webkit.org/show_bug.cgi?id=10894 
  15. ^ Bug 15550 - WebKit does not support CSS3 column-span:, Webkit, https://bugs.webkit.org/show_bug.cgi?id=15550 
  16. ^ Bug 8735 - CSS 2.1 visibility: collapse rendered as visibility: hidden, Webkit, https://bugs.webkit.org/show_bug.cgi?id=8735 
  17. ^ Bug 16662 - CSS3: Implement calc(), Webkit, https://bugs.webkit.org/show_bug.cgi?id=16662 
  18. ^ Bug 27160 - Implement vw/vh/vm (viewport sizes) from CSS 3 Values and Units, Webkit, https://bugs.webkit.org/show_bug.cgi?id=27160 

[edit] Presto references

[edit] Prince XML references

[edit] Other references

[edit] External links

  • WebDevout — mostly covers Windows browsers. Extensive bug testing.
  • QuirksMode — comprehensive but lacks latest versions.