TIL that all modern browsers now support complex selectors in :not()! 😍
Test: dabblet.com/gist/e7769cbe2
So you can do things like:
- .foo :not(.foo .foo *) to match things inside one .foo wrapper but not two
- .container :not(.content *) to get simple (shallow) “donut scope”
Conversation
This Tweet was deleted by the Tweet author. Learn more
Replying to
Excellent point!! Though not sure support for :is() [1] is that much worse from support for selector lists in :not() [2]
Though data seems incorrect for [2] (Chrome 88 does support)
[1]: caniuse.com/css-matches-ps
[2]: caniuse.com/css-not-sel-li
1
1
Show replies
Replying to
That looks very nice :) My personal "dream" would be full XPath axes and ideally also predicates in CSS selectors. Is this too far-fetched?
Replying to
`.container :not(.content *)` matches the class="content" element itself. Should it instead be `.container :not(.content, .content *)`?
jsbin.com/keyibog/edit?h
2
I got bitten by this like 2 weeks ago, one developer got the latest chrome, me and another one were still on the prev version, it was working on his computer and breaking on ours, debugging session was a hell.
1
Show additional replies, including those that may contain offensive content
Show