Support for nth-child(An+B of sel) , nth-last-child(An+B of sel) pseudo classes
Categories
(Core :: CSS Parsing and Computation, enhancement)
Tracking
()
People
(Reporter: hunboy, Assigned: zrhoffman)
References
(Blocks 4 open bugs)
Details
Attachments
(1 file, 3 obsolete files)
|
1.61 KB,
text/html
|
Details |
User Agent: Mozilla/5.0 (Windows NT 5.1; rv:19.0) Gecko/20100101 Firefox/19.0 Build ID: 20130307023931 Steps to reproduce: Expected results: Based on discussion at Bug 854125 and following w3c selectors level 4 draft http://dev.w3.org/csswg/selectors4/#the-nth-match-pseudo implement nth-match, nth-last-match pseudo classes
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Updated•11 years ago
|
|
|
Reporter | |
Comment 1•10 years ago
|
||
The sel4draft has been changed, nth-match, nth-last-match was removed and feature merged to nth-child with this syntax: nth-child(An+B of sel) where sel is a list of selectors http://dev.w3.org/csswg/selectors4/#the-nth-child-pseudo "By passing a selector argument, we can select the Nth element that matches that selector. For example, the following selector matches the first three “important” list items, denoted by the .important class: li:nth-child(-n+3 of .important) Note that this is different from moving the selector outside of the function, like: li.important:nth-child(-n+3) This selector instead just selects the first three list items if they also have the .important class."
|
|
Reporter | |
Comment 2•10 years ago
|
||
upgrading testcase based on changes
WebKit support: https://bugs.webkit.org/show_bug.cgi?id=136845 https://bugs.webkit.org/show_bug.cgi?id=137593
Additional testcase https://output.jsbin.com/meliga/quiet
|
||
Updated•8 years ago
|
|
||
Updated•8 years ago
|
|
||
Comment 6•7 years ago
|
||
Any timeframe at when this might be implemented?
|
||
Comment 7•4 years ago
|
||
This got a big mention on css-tricks: https://css-tricks.com/
|
||
Comment 9•3 years ago
|
||
That's quite a missed feature. nth-child() and nth-of-type() run the 50% of the way but this syntax improvement can be used as the next level of nth selectors!
|
||
Comment 10•2 years ago
|
||
Bramus Van Damme mentioned the "x of y" part at CSS Day 2022. Would be great to see that supported in more browsers!
|
||
Updated•2 years ago
|
|
Assignee | |
Comment 11•1 year ago
|
||
A lot of the work already done for :is() and :where() can be reused, so
the most significant change is a hashmap of caches for each of
:nth-child(An+B of S) and :nth-last-child(An+B of S).
Depends on D165778
|
||
Updated•1 year ago
|
|
|
Assignee | |
Comment 12•1 year ago
|
||
Drive-by simplification now that the function exists.
Depends on D165779
|
|
||
Comment 13•1 year ago
|
||
Comment on attachment 9310337 [details]
Bug 854148 - Reuse list_matches_complex_selector() where possible r?#style
Revision D165780 was moved to bug 1808228. Setting attachment 9310337 [details] to obsolete.
|
|
||
Updated•1 year ago
|
|
|
Assignee | |
Updated•1 year ago
|
|
||
Updated•1 year ago
|
|
||
Updated•1 year ago
|
|
|
||
Updated•1 year ago
|
|
|
Assignee | |
Updated•1 year ago
|
|
|
Assignee | |
Updated•1 year ago
|
|
|
Assignee | |
Comment 14•1 year ago
|
||
Moving dev-doc-needed to bug 1808229, since, although support for support for :nth-child(An+B of selector list) and :nth-last-child(An+B of selector list) is shipping, bug 854148 still depends on :nth-child(An+B of :has()) and :nth-last-child(An+B of :has(...)) invalidation (bug 1818155).
|
|
Assignee | |
Comment 15•7 months ago
|
||
Shipping since Firefox 113 (landed in bug 1808229 comment 3, intent sent in https://groups.google.com/a/mozilla.org/g/dev-platform/c/eQeeFKYJ038/m/EfFYIA87AAAJ)! Now that :nth-child(An+B of :has()) invalidation is complete (in bug 1792501, thanks David!), let's close the [meta].
Description
•