CSS selectors

Back to the index.

CSS2 selectors | CSS3 selectors | CSS3 UI selectors | CSS4 selectors

Here are almost all CSS2 and 3 selectors, and the CSS3 UI selectors (mostly structural pseudo-classes).

This is the mobile table. See also the desktop table.

Last major update on 1 October 2013.

I'm writing a CSS book.

Basics

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
Element selector `p`	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
Element selector `p`
Class selector `p.test`	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
Class selector `p.test`
ID selector `p#test`	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
ID selector `p#test`
Descendant selector `p span`	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
Descendant selector `p span`
* selector Selects all elements	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
* selector Selects all elements
Multiple classes Two or more class names	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
Multiple classes Two or more class names

Combinators

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
> selector Selects an element that is a child of another element	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

+ selector Selects an element that is a next sibling of another element	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
	Static The browser doesn’t correctly update the styles of the original element when another element is placed before it. UC applies the style to all paragraphs.
~ selector Selects an element that is a general next sibling of another element	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

Attribute selectors

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
[attr] selector Selects an element with a certain attribute	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
[attr] selector Selects an element with a certain attribute
[attr=value] selector Selects an element with a certain attribute value	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

[attr~=value] selector Selects an element with an attribute that includes a certain value; space-separated	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

[attr^=value] selector Selects an element with a certain attribute that starts with a certain value	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

[attr$=value] selector Selects an element with a certain attribute that ends with a certain value	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

[attr*=value] selector Selects an element with a certain attribute that contains a certain value; not necessarily space-separated	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

[attr\|=value] Attribute value starts with "value" or "value-"	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And

Pseudo-elements

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
:before and :after To generate content before and after an element	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes

:first-letter The first letter of an element	Almost		Almost			Almost		Yes	Almost		Almost				Yes	Almost			Almost						Yes		Yes
:first-letter The first letter of an element	WebKit-based browsers leave the first 'T' at the start of the paragraph when you add text. Opera Mobile leaves out the 'T' of the second and subsequent sentences when you do the dynamic test. NetFront and Samsung Pocket do not apply the `:first-line` styles to the first letter.
:first-line The first line of an element	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:first-line The first line of an element
::selection Text selected by the user.	No		Samsung			Yes		No	Yes		Yes	No			Yes	Untestable			ut		Yes	ut	Yes	ut	ut	Yes	ut	-moz-
::selection Text selected by the user.	Untestable / UT Browser does not support the selecting of text Samsung Android WebKits support it; others don’t.

Pseudo-classes

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
:active An element in an active state.	No		No			No	Yes	No		Yes	Yes			No	No				No		Alternative	No			No	Yes	Yes
:active An element in an active state.	Styles should be applied ontouchstart and removed ontouchend. To be honest, I don't see a lot of use for this selector on touchscreen devices. Nintendo supports it, but only when you hold the element for a while. A simple tap is not enough.
:hover An element in a hovered state.	Special		Yes			Yes		Special	Yes		Desktop			Yes	Yes				Yes						Yes	Desktop	Yes
:hover An element in a hovered state.	Normally the `:hover` styles are applied when the user touches the element, and removed when the user touches another element. Special Browser implements styles (and their removal) only on touchable elements; i.e. links, form fields, or elements with an explicit onclick event handler. Desktop Browser removes styles when touch ends; this is more in line with what the desktop browsers do.
:link Unvisited link	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:link Unvisited link
:not Negation of a selector	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:not Negation of a selector
:target Element that is a target of a hash (`page.html#testHash`)	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Incomplete		Yes
	IE doesn’t react to the Back and Forward buttons: the element doesn’t apply or remove the pseudo-class at all. This used to be an Opera problem, while IE used to get it right. Symbian Anna supports it, but the Back button doesn’t take you back to the un-hashed URL, but to the previous page. IE10: see above
:visited Visited link	Yes		se	Yes		Yes	Incomplete	se		Yes	Yes				Yes		se	Yes	Yes						Yes		No	Yes
:visited Visited link	There’s a security issue with `:visited`. See the page for more details. se Security issue active The Chrome 29 on Nexus 7 (Android 4.3) does not show the visited link in green, while it should. The Chrome 29 on HTC One (Android 4.2) does everything right.
Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And

Structural pseudo-classes

Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
:empty Empty elements	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:empty Empty elements	Static Browser doesn’t update the styles when content is added to the element.
:first-child An element that is the first child of its parent	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
	Static Browser doesn’t update the styles when elements are added dynamically.
:first-of-type The first element of its type.	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:first-of-type The first element of its type.	Static Browser doesn’t update the styles when elements are added dynamically.
:last-child An element that is the last child of its parent	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:last-child An element that is the last child of its parent	Symbian 9.2 and S40 apply the :last-child styles to the :first-child.
:last-of-type The last element of its type.	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:last-of-type The last element of its type.	Static Browser doesn’t update the styles when elements are added dynamically.
Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And
:nth-child() Select elements according to a formula	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:nth-child() Select elements according to a formula
:nth-last-child()	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:nth-last-child()
:nth-last-of-type()	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:nth-last-of-type()
:nth-of-type() Select elements according to a formula	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:nth-of-type() Select elements according to a formula
:only-child An element that is the only child of its parent	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:only-child An element that is the only child of its parent	Symbian 9.2 and S40 apply the :only-child styles to the :first-child and don’t remove the styles when the :only-child gets a sibling.
:only-of-type The only element of its type.	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:only-of-type The only element of its type.	S40 applies the :only-of-type styles to the :first-of-type.
:root The root element, or initial containing block.	Yes		Yes			Yes		Yes			Yes				Yes				Yes						Yes		Yes
:root The root element, or initial containing block.
Selector	iOS		Android			Chrome		Opera			BlackBerry				Nokia				UC		Nintendo	Dolphin	Tizen	One	IE		Firefox
Selector	6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	Nintendo	Dolphin	Tizen	One	9	10	OS	And

UI state pseudo-classes

Selector	iOS	Android	Chrome	Opera	BlackBerry	Nokia	UC	Nintendo	Dolphin	Tizen	One	IE	Firefox
6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	9	10	OS	And
:checked Checked elements (checkboxes or radios)	Yes	No	Yes	No	Yes	No	No	Yes	No	Yes	No	Yes	No	Yes	No

:default Default choices in select boxes or groups of radio buttons	No	No	No	No	Incomplete	No	No	No	No	No	No
Tested on radio buttons and select boxes. Opera doesn’t support it on select boxes.
:disabled Disabled form fields	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes

:enabled Non-disabled form fields	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes

:focus Form fields that have the keyboard focus	Yes	Yes	Yes	No	Yes	Yes	No	Yes	No	Yes	Yes	Yes
Sidenote: Sony Android 4 shows the label text in focused form fields. I think this is an excellent idea that deserves to be copied.
:in-range Form fields with values that are in range (numbers)	Yes	No	Yes	Yes	No	Yes	No	Yes	No	Yes	Yes	No	Yes
The Sony Android 4, as well as UC, wait until the focus is removed from the form field to apply the styles. The others do it directly when a number is typed.
:invalid Form field with value that does not conform to `pattern`	Yes	No	Yes	Yes	Buggy	Yes	Yes	No	Yes	No	Yes	Yes	No	Yes	Yes
The Sony Android 4 waits until the focus is removed from the form field to apply the styles. The others do it directly when a number is typed. Opera Mini always follows the `:valid` styles even if the value is invalid.
Selector	iOS	Android	Chrome	Opera	BlackBerry	Nokia	UC	Nintendo	Dolphin	Tizen	One	IE	Firefox
6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	9	10	OS	And
:optional Non-required form fields	Yes	Yes	Yes	Buggy	Yes	Yes	Yes	Yes	No	Yes	Yes
Opera Mini gives all form fields the :optional styles.
:out-of-range Form fields with values that are not in range (numbers)	Yes	No	Yes	Yes	No	Yes	No	Yes	No	Yes	Yes	No	Yes
The Sony Android 4, as well as UC, wait until the focus is removed from the form field to apply the styles. The others do it directly when a number is typed.
:read-only Readonly form fields	Yes	Yes	Yes	Yes	Yes	No	Yes	Yes	No	No

:read-write Non-readonly form fields	Yes	Yes	Yes	Yes	Yes	No	Yes	Yes	No	No

:required Required form fields	Yes	Yes	Yes	Buggy	Yes	Yes	Yes	Yes	No	Yes	Yes
Opera Mini gives all form fields the :optional styles.
:valid Form field with value that conforms to `pattern`	Yes	No	Yes	Yes	Buggy	Yes	Yes	No	Yes	No	Yes	Yes	No	Yes	Yes
The Sony Android 4 waits until the focus is removed from the form field to apply the styles. The others do it directly when a number is typed. Opera Mini gives all form fields the :valid styles.
Selector	iOS	Android	Chrome	Opera	BlackBerry	Nokia	UC	Nintendo	Dolphin	Tizen	One	IE	Firefox
6	7	2	3	4	18	29	Mini	Mob 12	Mob 15	6	7	PB	10	Xpress	MeeGo	Anna	Belle	8	9	9	10	OS	And

Tested browsers

Mobile browser test array 1.1.1; October 2013

iOS 6: WebKit 536; Default browser on iPhone 4S with iOS 6.1.3
iOS 7: WebKit 537; Default browser on iPad 2 with iOS 7.0
Android 2: WebKit 533; Default browser on HTC Legend, Android 2.2; Default browser on LG Optimus something, Android 2.2; Default browser on Samsung Galaxy Pocket, Android 2.3.6
Android 3: WebKit 534; Default browser on Packard Bell tablet, Android 3.2.1
Android 4: WebKit 534; Default browser on Samsung Galaxy Note I, Android 4.0.3; Default browser on Sony Xperia S, Android 4.0.4; Default browser on Xiaomi M2, Android 4.1.1; Default browser on Huawei C8813, Android 4.1.1; Default browser on Samsung Galaxy S3, Android 4.1.2; Default browser on HTC One X, Android 4.2.2
Chrome 18: WebKit 535; Default browser on Samsung Galaxy S4, Android 4.2; On Sony Xperia S, Android 4.0.4. This is a downloaded version from Google; It will be interesting to see if Samsung’s purported Chrome 18 is really the real Chrome 18.
Chrome 29: Blink (Chromium 29); On HTC One X, Android 4.2.2; On Nexus 7, Android 4.3
Opera Mini: Presto; Proxy browser; 7.0.5 on iPad 2, iOS 7.0; 7.1 on BlackBerry 9800 (OS6); 7.1 on Nokia PureView 808, Symbian Belle; 7.5 on Samsung Galaxy Note I, Android 4.0.3
Opera Mobile 12: Presto; 12.00 on Nokia E7, Symbian Anna; 12.10 on Samsung Galaxy Pocket, Android 2.3.6
Opera Mobile 15: Blink (Chromium 28); On Sony Xperia S, Android 4.0.4; On Nexus 7, Android 4.3
BlackBerry 6: WebKit 534; Default browser on BB Torch 9800 (OS6)
BlackBerry 7: WebKit 534; Default browser on BB Torch 9810 (OS7)
BlackBerry PB: WebKit 536; Default browser on PlayBook with OS 2.1.0
BlackBerry 10: WebKit 537; Default browser on BlackBerry Z10 (BB OS 10.1); This device has 1GB of internal memory instead of the customary 2GB, which may matter in performance tests.
Xpress: Gecko 20100401; this version was used for some Firefoxes from 3 to 4.; Proxy browser; 3.2 on the Nokia Asha 311, S40.; This browser used to be called Ovi. Nokia developed it because it saw how succesful Opera was on Nokia’s own devices.
MeeGo: WebKit 534; Default browser on Nokia N950, MeeGo Harmattan 1.2; Originally slated as Symbian’s successor, MeeGo was ousted in favour of Windows Phone. Some devices were sold, however, and a Finnish company is trying to re-start MeeGo under the name Sailfish. Also, rumour has it that Nokia is quietly hiring back ex-MeeGo people, so a Nokia-based restart is not entirely impossible.
Anna: WebKit 533; Default browser (7.3) on Nokia E7, Symbian Anna; The next-to-last Symbian build. I don’t think it was the prime Symbian build for long; it was replaced by Belle fairly soon. But it’ll be in some people’s pockets.
Belle: WebKit 535; Default browser (8.3) on Nokia PureView 808, Symbian Belle FP2; The most recent Symbian build.
UC: WebKit 534; UC 8.5.1 on Xiaomi M2 (Android 4.1.1); UC 9.2.3 on Huawei C8813 (Android 4.1.1); The largest Chinese browser. I’m testing the full variant, not the proxy. These browsers were pre-installed (next to Android WebKit; don’t ask me why).
Nintendo: WebKit 536; Nintendo browser 2.0.0 on Wii U 4.0.0; Supposed to be based on NetFront.
Dolphin: WebKit 534; Beta 1.3.1 on Sony Xperia S, Android 4.0.4.; Independent full browser for Android. The non-beta is a skin over the Android default browser. The beta uses their own WebKit port.
QQ One: WebKit 533; 4.2.2 on HTC One X, Android 4.2.2; This is the downloadable, international browser TenCent created.
Tizen: WebKit 537; Default browser on Ref.Device-PQ by Samsung; Tizen 2.2; Tizen is an OS jointly being developed by Samsung and Intel. I expect Samsung to start producing devices this year, and it will get a few percent of market share.
IE9: Trident; Default browser on Nokia Lumia 800, Windows Phone 7.5.
IE10: Trident; Default browser on Nokia Lumia 820, Windows Phone 8.0.
Firefox OS: Gecko 18; Geekphone/Telefónica (Peak and/or qcom); Boot2Gecko 1.0.1.0-prerelease
Firefox Android: Gecko 23; 23 on HTC One X, Android 4.2.2

Browsers by WebKit version:

533: Android 2; Anna; UC; QQ 2.0; One
534: Android 3 and 4; BB 6 and 7; MeeGo; Dolphin
535: Belle; Chrome 18
536: iOS6; BlackBerry PlayBook; NetFront
537: iOS7; BlackBerry 10; Tizen