Re: [csswg-drafts] [css-syntax] Make it easier to express ranges for <An+B> selectors (#4140)

We did a breakout at the WG meeting, and participants united behind the following proposal:

* `<an+b>` syntax is extended to `<current-syntax> | <range-syntax>`, where range syntax is `n [ < | <= | = | => | > ] <int>` or the same with int and N swapped.
* The `n` in the range syntax is literal, it's not a variable or a more complicated An+B value.

So the examples in [the table](https://github.com/w3c/csswg-drafts/issues/4140#issuecomment-517857973) could be written as:

* Match the first three elements: `:nth-child(n >= 3)`
* Match every even element up to the eighth / match every even element up to four: either `:nth-child(n <= 4 of :nth-child(even))` or `:nth-child(n <= 8):nth-child(even)`
* Match every third element between the sixth and the fifteenth / match every third element up to four starting at the sixth: either `:nth-child(6 <= n <= 15):nth-child(3n)` or (several additional ways depending on how you want to express it)
* Match every third element starting with the second one and ending at the third last: considerable disagreement on what this actually *meant*, but if it's "of the 3n elements, take the 2nd to the 3rd last", then `:nth-last-child(n >= 3 of :nth-child(n >= 2 of :nth-child(3n)))`. Other interpretations can also be written, generally slightly simpler.

-- 
GitHub Notification of comment by tabatkins
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4140#issuecomment-1644714277 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 20 July 2023 22:35:54 UTC