Compatibility table: CSS3 Selectors

A few CSS3 selectors are already making their way into modern web browsers. Of the browsers tested thus far, Konqueror is the clear leader in implementation, with the Gecko (Mozilla, etc) engine not too far behind. In all cases I have used the latest current browser release, except for Internet Explorer where I’ve used the Beta of IE7 (as IE6 has no support at all).

Rather than go into depth about all the new selectors available in CSS3, you can read more about them in the W3C Selectors Working Draft and the excellent guide at 456 Berea St.

Note: The table below is not an exhaustive list of CSS3 selectors or modern browsers, it is only the beginning of a work in progress. As we continue to test, this table will expand. The tests have been run only on the most basic implementation of the selector, and should not be considered definitive.

CSS3 Selectors
Selector Gecko 1.81 IE 7 Opera 9.5 Safari 1.3 Safari 2.0 Konq. 3.5.4 OmniWeb 5.5 β1
E[foo*="bar"] Yes Yes Yes Yes Yes Yes Yes
E[foo$="bar"] Yes Yes Yes Yes Yes Yes Yes
E[foo^="bar"] Yes Yes Yes Yes Yes Yes Yes
E ~ F Yes Yes Yes No Yes Yes Yes
:root Yes2 No Yes Yes Yes Yes Yes
:last-child Yes No Yes No3 No3 Yes No3
:nth-child() No No Yes No No Yes No
:nth-last-child() No No Yes No No Yes No
:only-child Yes No Yes No5 No5 Yes No5
:first-of-type No No Yes No No Yes No
:last-of-type No No Yes No No Yes No
:nth-of-type() No No Yes No No Yes No
:nth-last-of-type() No No Yes No No Yes No
:not() Yes No Yes Yes Yes Yes Yes
:empty Yes No Yes No3 Yes Yes Yes
:target Yes No Yes Yes Yes Yes Yes
:enabled Yes No Yes No No Yes No
:disabled Yes No Yes No No Yes No
:checked Yes2 No Yes No No Yes Yes
:selection Yes4 No Yes No Yes Yes Yes
  1. † Gecko 1.8 is the rendering engine for Firefox, Mozilla Suite, Seamonkey, Camino, Flock, etc.
  2. For HTML documents, styling :root is the same as styling html.
  3. Support for styling checkboxes in Firefox is very limited.
  4. Safari and OmniWeb incorrectly apply this to all the selected elements.
  5. With browser prefix.
  6. Safari and OmniWeb incorrectly treat :only-child the same as :first-child.