Compatibility table – Backgrounds and Borders module
| Property | Presto 2.2 | Presto 2.4+ | WebKit 4 | Gecko 1.9.1 | Trident |
|---|---|---|---|---|---|
| background-color | Yes | Yes | Yes | Yes | |
| background-image | Partial* | Yes | Partial*† | Partial† | |
| background-repeat | Partial‡ | Yes | Partial‡ | Partial‡ | |
| background-attachment | Partial§ | Yes | Partial§ | Partial§ | |
| background-position | Yes | Yes | Yes | Yes | |
| background-clip | No | Yes | Partial‖ ¶ | Partial‖ ¶ | |
| background-origin | No | Yes | Partial‖ ¶ | Partial‖ ¶ | |
| background-size | Yes‖ | Yes | Partial‖ ** | no | |
| background | Partial†† | Partial†† | Partial†† | Partial†† | |
| border-top-color | Yes | Yes | Yes | Yes | |
| border-right-color | Yes | Yes | Yes | Yes | |
| border-bottom-color | Yes | Yes | Yes | Yes | |
| border-left-color | Yes | Yes | Yes | Yes | |
| border-color | Yes | Yes | Yes | Yes | |
| border-top-style | Yes | Yes | Yes | Yes | |
| border-right-style | Yes | Yes | Yes | Yes | |
| border-bottom-style | Yes | Yes | Yes | Yes | |
| border-left-style | Yes | Yes | Yes | Yes | |
| border-style | Yes | Yes | Yes | Yes | |
| border-top-width | Yes | Yes | Yes | Yes | |
| border-right-width | Yes | Yes | Yes | Yes | |
| border-bottom-width | Yes | Yes | Yes | Yes | |
| border-left-width | Yes | Yes | Yes | Yes | |
| border-width | Yes | Yes | Yes | Yes | |
| border-top-right-radius | No | Yes | Yes‖ | No‡‡ | No |
| border-bottom-right-radius | No | Yes | Yes‖ | No‡‡ | No |
| border-bottom-left-radius | No | Yes | Yes‖ | No‡‡ | No |
| border-top-left-radius | No | Yes | Yes‖ | No‡‡ | No |
| border-radius | No | Yes | Partial‖ §§ | Yes‖ | No |
| border-top | Yes | Yes | Yes | Yes | |
| border-right | Yes | Yes | Yes | Yes | |
| border-bottom | Yes | Yes | Yes | Yes | |
| border-left | Yes | Yes | Yes | Yes | |
| border | Yes | Yes | Yes | Yes | |
| border-image-source | No | No | No | No | No |
| border-image-slice | No | No | No | No | No |
| border-image-width | No | No | No | No | No |
| border-image-outset | No | No | No | No | No |
| border-image-repeat | No | No | No | No | No |
| border-image | No | Yes | Yes‖ | Yes‖ | No |
| box-break | No | No | No | No | No |
| box-shadow | No | Yes | Partial‖ | Yes‖ | No |
Browsers and Rendering engines
Each property and unit was tested in the latest version of each of the major rendering engines – Presto, WebKit, Gecko and Trident. The browsers used in the charts above were as follows:
- Presto 2.2
- Tested using Opera 10 beta 3
- Presto 2.4
- Tested using Opera 10.5 pre alpha. This uses Presto 2.5, but the support for Backgrounds and Borders is the same as Presto 2.4
- WebKit
- Tested using Safari 4 final
- Gecko 1.9
- Tested using Firefox 3.5 final
- Trident
- Tested using IE8 final
Notes
- * multiple images are not supported.
- † SVG image format is not supported. In the case of WebKit it is supported but very limited.
- ‡
roundandspacevalues are not supported. - §
localvalue is not supported. - ‖ Uses vendor prefix: -o- for Opera, -moz- for Mozilla, -webkit- for WebKit and -ms- for Microsoft
- ¶ Gecko and WebKit do not support
content-boxvalue forbackground-clipandbackground-originand theno-clipvalue forbackground-clip. Both support the alternative syntaxborderandpaddinginstead ofborder-boxandpadding-boxrespectively. - **
coverandcontainvalues are not supported. - †† new CSS3 properties not included in the
backgroundshorthand. This part of the spec is currently fairly unstable. - ‡‡ Gecko uses an alternative syntax, with prefix:
-moz-border-radius-topright, etc. - §§ WebKit doesn’t support specifying different x and y radius in the
border-radiusshorthand via the/notation. - ‖‖ WebKit doesn’t support the inset keyword for inset box shadows, or the spread value.