Last major update on 23 February 2012.
See the CSS Selector Test for tests of and information about CSS3 selectors.
Earlier versions of this page has been translated into Brazilian Portuguese and Romanian.
The contents of my CSS pages and browser compatibility.
Want these Tables updated? Join the donation drive.
| Quirks and Strict mode | How to trigger them, what the differences are. Contains compatibility table. |
| CSS Hacks | Be very, very careful. |
| Conditional comments | A generally reliable method for separating IE from all other browsers. |
| Clearing floats | without clear: both. |
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Selects all elements | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| Selects an element that is a child of another element | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Selects an element that is a next sibling of another element | No | Static | Almost | Yes | Yes | Yes | Yes | Yes | |||||||||||
|
|||||||||||||||||||
| Selects an element with a certain attribute | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Whether an element can support two or more class names | Buggy | Yes | Yes | Yes | Yes | Yes | |||||||||||||
|
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| To generate content before and after an element | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| An element in a hovered (mouseover) or active (mousedown) state. | Minimal | Incom |
Almost | Yes | Yes | Yes | Yes | ||||||||||||
|
|||||||||||||||||||
| An element that is the first child of its parent | No | Static | Almost | Yes | Yes | Yes | Yes | Yes | |||||||||||
|
|||||||||||||||||||
| The first line or first letter of an element | Yes | Yes | Almost | Almost | Almost | ||||||||||||||
|
|||||||||||||||||||
| Form fields that receive user focus | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
|
|
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
for :before/:after
|
No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| No | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
To assign counters to headings or other elements. |
|||||||||||||||||||
| Change cursor style | Incom |
Almost | Yes | Almost | Yes | Yes | Almost | Incom |
|||||||||||
|
|||||||||||||||||||
| Incom |
Yes | Almost | Yes | Yes | Yes | ||||||||||||||
Incomplete: lacks 2 or more values; almost: lacks 1 value. |
|||||||||||||||||||
| Types, image, position | Minimal | Incom |
Incom |
Yes | Yes | Incom |
|||||||||||||
|
|
|||||||||||||||||||
| No | Mini |
Yes | Yes | Yes | Yes | Yes | |||||||||||||
|
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| A sort of border, but it doesn’t count for the box model. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Incor |
Yes | Yes | Yes | Yes | Yes | ||||||||||||||
|
|||||||||||||||||||
| Incom |
Al |
Yes | Yes | Almost | Almost | Yes | |||||||||||||
IE 5/6 don’t support position: fixed
|
|||||||||||||||||||
| Incom |
Yes | Yes | Almost | Almost | Yes | ||||||||||||||
visibility: collapse. |
|||||||||||||||||||
empty-cells,
border-collapse,
border-spacing,
table-layout,
caption-side
|
Incom |
Yes | Yes | Yes | Yes | Yes | |||||||||||||
See page for detailed compatibility. |
|||||||||||||||||||
| To remove text wrapping or to make an element behave like a pre | Incom |
Yes | Yes | Yes | Yes | Yes | |||||||||||||
See page for detailed compatibility. IE9 has one bug. |
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Selects an element that is a general next sibling of another element | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Selects an element with an attribute whose value starts with, ends with, or contains a certain string. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Empty elements | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| For enabled, disabled, or checked form fields. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| The first element of its type. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| An element that is the last child of its parent | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| The last element of its type. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Negation of a selector | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| Select elements according to a formula | No | Yes | Yes | Yes | Yes | Incor |
|||||||||||||
|
|||||||||||||||||||
| No | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| No | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| Select elements according to a formula | No | Yes | Yes | Yes | Yes | Incor |
|||||||||||||
|
|||||||||||||||||||
| An element that is the only child of its parent | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| The only element of its type. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| The root element, or initial containing block. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Text selected by the user. | No | Yes | -moz- | Yes | Yes | Yes | |||||||||||||
Element that is a target of a hash (page.html#testHash)
|
No | Incom |
Yes | Yes | Yes | Yes | |||||||||||||
|
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Prefixed | No | Yes | Yes | Yes | No | ||||||||||||||
| States whether the background image scrolls with the document, the element, or not at all. | Incor |
Incom |
Yes | Incom |
Yes | Yes | Yes | ||||||||||||
local.scroll means local. |
|||||||||||||||||||
| States whether the background covers the border-box (default), padding-box or content-box. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| States whether the background originates in the border-box, padding-box (default) or content-box. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
States how the background is repeated. Note the new values space and
round.
|
Incom |
Yes | Incom |
Incor |
Incor |
Yes | |||||||||||||
space and round.space and round as no-repeat. |
|||||||||||||||||||
| States the size of the background image, in pixels, percents, or with two special values. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| How to define more than one background image on an element | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
| No | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| No | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| No | Yes | -moz- | Yes | Yes | Yes | ||||||||||||||
| To divide one block of text into several columns, newspaper-style. | No | Yes | -moz- | -webkit- | -webkit- | Yes | |||||||||||||
| How to define a layout Prefixed | No | Yes | XUL | No | No | No | |||||||||||||
|
|
|||||||||||||||||||
| filter | Yes | Yes | Yes | Yes | Yes | ||||||||||||||
| Allow the user to resize an element. | No | Yes | Yes | Yes | No | ||||||||||||||
|
Firefox allows you to decrease the size of the element. In Chrome and Safari the element’s size can only be increased. |
|||||||||||||||||||
| Shows ellipsis characters when a text flows outside its box. | No | Yes | Yes | Yes | Yes | Yes | |||||||||||||
This property only makes sense when a box has |
|||||||||||||||||||
| Create a text-shadow. | No | Yes | Yes | Yes | Yes | ||||||||||||||
| Prefixed | No | Almost | Almost | Almost | Almost | ||||||||||||||
|
|||||||||||||||||||
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
There are some pretty interesting units and values being proposed.
| Selector or declaration | IE 5.5 | IE 6 | IE 7 | IE8 | IE9 | IE10 pr2 | FF 11.0 Win | FF 10.0.2 Mac | Saf 5.1 Win | Saf 5.1.2 Mac | Chrome 18 Win | Chrome 17 Mac | Opera 11.61 Win | Opera 11.61 Mac | |||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| To perform calculations in CSS Prefixed | No | Yes | Yes | No | No | No | |||||||||||||
| vw, vh, and vm units; they mean hundreths of the viewport width and height | No | Yes | No | No | No | No | |||||||||||||
I wrote test cases for the following values and units, but they’re not supported by any browser yet.