CSS Level 4 Selectors (e.g. :scope with Element.querySelector) #1058

Fyrd · 2015-05-12T04:15:17Z

CSS Level 4 Selectors

Available on site now:

:placeholder-shown
:in-range & :out-of-range
:matches()
:default
:indeterminate
case insensitive modifier
selector list argument of :nth-child and :nth-last-child (replaced nth-match)
:optional
>> descendant combinator
Selector list in :not()
:has() (replaced Selector subject)
:focus-within
:dir() pseudo-class
:read-only & :read-write

Pending review:

:any-link

Not (yet) available:

:scope (issue) (spec)
:blank (issue) (spec)
Grid structural combinators (column combinator) (issue) (spec)

This issue was imported from Google Moderator

Moderator votes: +18
Issue added by Jared J on 2014-04-17

The text was updated successfully, but these errors were encountered:

kaleb · 2015-05-21T10:51:51Z

+1 I was hoping this worked in IE 11. It doesn't.

nickleus · 2015-05-28T09:24:03Z

+1
i'm mostly interested in explicitly choosing a compound selector as the "subject":
http://www.w3.org/TR/selectors4/#subject

LDigital84 · 2015-05-30T18:15:10Z

+1

Schweinepriester · 2015-06-08T09:39:39Z

+1

LPGhatguy · 2015-06-12T17:36:16Z

I'd like to see this, especially for nth-match

Schweinepriester · 2015-06-15T15:32:18Z

also see http://www.sitepoint.com/future-generation-css-selectors-level-4/, especially :matches() :)

Serator · 2015-06-24T15:26:38Z

+1

cvrebert · 2015-07-01T01:27:45Z

+1

jackwickham · 2015-07-07T20:37:52Z

+1

ccoenen · 2015-09-25T20:07:19Z

I'd have looked up case-insensitive attribute matches (see http://www.w3.org/TR/selectors4/#attribute-case )

stof · 2015-10-08T08:14:56Z

+1

roselan · 2015-10-13T10:41:13Z

+1

rajsite · 2015-10-20T23:09:35Z

+1

aronstrandberg · 2015-11-13T16:55:42Z

+1 (nth-match especially)

yukulele · 2015-11-22T22:27:05Z

https://developer.mozilla.org/en-US/docs/Web/CSS/%3Ascope

yukulele · 2015-11-22T22:27:08Z

+1

r-k-b · 2015-12-04T21:57:04Z

+1
Would specifically like to see the upgraded :not negation selector that can take lists of simple selectors.

vincentorback · 2015-12-09T11:33:26Z

+1

UnrulyNatives · 2016-01-11T23:17:08Z

+1

chaos986 · 2016-01-17T15:25:38Z

+1

Llbe · 2016-02-03T07:38:52Z

+1

AdrianoCahete · 2016-02-18T16:39:35Z

+1

screeny05 · 2016-02-23T09:24:00Z

+1

Fyrd · 2016-06-06T10:30:09Z

:focus-within now available at http://caniuse.com/#feat=css-focus-within

Fyrd · 2016-06-18T23:37:28Z

:dir now available at http://caniuse.com/#feat=css-dir-pseudo

PunkSage · 2016-07-14T17:20:33Z

:scope +1

stevenvachon · 2016-09-08T13:42:30Z

@Fyrd compound selectors in :not() is CSS4 too. Firefox currently doesn't support it for this reason, but Chrome and WebKit do.

stevenvachon · 2016-09-08T13:45:49Z

@nickleus selector subjects have been replaced with :has().

cvrebert · 2016-09-08T15:27:49Z

@stevenvachon Is that somehow different from http://caniuse.com/#feat=css-not-sel-list ?

stevenvachon · 2016-09-08T15:30:58Z

@cvrebert that refers to :not(.class1, .class2) where I'm referring to :not(.class1.class2).

pmaxhogan · 2017-01-10T15:42:56Z

+1 Please!

roastchicken · 2017-03-29T00:08:19Z

+1

boneyfantaseas · 2018-04-11T12:34:33Z

+1 especially for :blank

acdha · 2018-09-05T13:33:55Z

:scope probably should be listed because it's supported by most of the non-Microsoft browsers according to https://developer.mozilla.org/en-US/docs/Web/CSS/:scope and that'd make it really easy for someone to miss that important caveat during development.

* add link to MS Edge platform status * update spec to reflect published standard Relates to Fyrd#1058

franktopel · 2018-10-26T14:11:42Z

What is the state of :scope?

GreLI · 2018-12-06T10:13:00Z

It worth noting that :empty has different meaning in CSS Level 4 Selectors — now it matches nodes containing only white-spaces. :blank has removed that meaning, and now it's proposed for empty inputs (at-risk).

chharvey · 2019-04-01T20:31:18Z

kiding · 2019-11-08T01:18:22Z

Many of them are actively being implemented, such as :is() selector. Currently only the MDN data is listed.

dnknn · 2020-08-03T07:30:24Z

:local-link

Fyrd added GM import Support data suggestion labels May 12, 2015

cvrebert mentioned this issue May 19, 2015

What about including a CSS4 selectors table? You can test this feature here #1182

Closed

cvrebert mentioned this issue Jul 1, 2015

Missing new CSS selector #1699

Closed

cvrebert mentioned this issue Jul 25, 2015

Add :any-link pseudo-class #1742

Closed

cvrebert mentioned this issue Jan 13, 2016

CSS4 pseudo-class E:matches(s1, s2) #2205

Closed

cvrebert mentioned this issue Mar 10, 2016

css :scope #2350

Closed

stevenvachon mentioned this issue Sep 8, 2016

compound selectors should transform to simple selectors csstools/postcss-selector-not#3

Closed

cvrebert mentioned this issue Sep 8, 2016

column combination #2789

Open

Fyrd added Support data suggestion set and removed Support data suggestion labels Mar 20, 2017

kloh-fr mentioned this issue Apr 3, 2017

Support for :focus-ring #3267

Closed

Schweinepriester mentioned this issue Aug 25, 2018

Please include :blank pseudo-class #4459

Closed

CITguy pushed a commit to CITguy/caniuse that referenced this issue Oct 6, 2018

update(css-nth-child-of): update spec status

94930f2

* add link to MS Edge platform status * update spec to reflect published standard Relates to Fyrd#1058

CITguy mentioned this issue Oct 6, 2018

update(css-nth-child-of): update spec status #4533

Merged

CITguy pushed a commit to CITguy/caniuse that referenced this issue Oct 6, 2018

update(css-nth-child-of): update spec status

e765128

* add link to MS Edge platform status * update spec to reflect published standard Relates to Fyrd#1058

chharvey mentioned this issue Jan 5, 2019

Case-sensitive CSS attribute selectors #4710

Closed

chharvey mentioned this issue Apr 18, 2019

[CSS Level 4 pseudo-class] :user-error #2890

Open

This was referenced Jun 27, 2022

:nth-col compatibility data missing #6349

Open

Add the :modal pseudo-class #6356

Open

Schweinepriester mentioned this issue Oct 1, 2024

Add :local-link pseudo selector #7169

Open

CSS Level 4 Selectors (e.g. :scope with Element.querySelector) #1058

CSS Level 4 Selectors (e.g. :scope with Element.querySelector) #1058

Comments

Fyrd commented May 12, 2015 • edited Loading

Available on site now:

Pending review:

Not (yet) available:

This issue was imported from Google Moderator

kaleb commented May 21, 2015

nickleus commented May 28, 2015

LDigital84 commented May 30, 2015

Schweinepriester commented Jun 8, 2015

LPGhatguy commented Jun 12, 2015

Schweinepriester commented Jun 15, 2015

Serator commented Jun 24, 2015

cvrebert commented Jul 1, 2015

jackwickham commented Jul 7, 2015

ccoenen commented Sep 25, 2015

stof commented Oct 8, 2015

roselan commented Oct 13, 2015

rajsite commented Oct 20, 2015

aronstrandberg commented Nov 13, 2015

yukulele commented Nov 22, 2015

yukulele commented Nov 22, 2015

r-k-b commented Dec 4, 2015

vincentorback commented Dec 9, 2015

UnrulyNatives commented Jan 11, 2016

chaos986 commented Jan 17, 2016

Llbe commented Feb 3, 2016

AdrianoCahete commented Feb 18, 2016

screeny05 commented Feb 23, 2016

Fyrd commented Jun 6, 2016

Fyrd commented Jun 18, 2016

PunkSage commented Jul 14, 2016 • edited Loading

stevenvachon commented Sep 8, 2016 • edited Loading

stevenvachon commented Sep 8, 2016

cvrebert commented Sep 8, 2016

stevenvachon commented Sep 8, 2016

pmaxhogan commented Jan 10, 2017

roastchicken commented Mar 29, 2017

boneyfantaseas commented Apr 11, 2018

acdha commented Sep 5, 2018

franktopel commented Oct 26, 2018

GreLI commented Dec 6, 2018 • edited Loading

chharvey commented Apr 1, 2019 • edited Loading

kiding commented Nov 8, 2019

dnknn commented Aug 3, 2020

Fyrd commented May 12, 2015 •

edited

Loading

PunkSage commented Jul 14, 2016 •

edited

Loading

stevenvachon commented Sep 8, 2016 •

edited

Loading

GreLI commented Dec 6, 2018 •

edited

Loading

chharvey commented Apr 1, 2019 •

edited

Loading