[csswg-drafts] [css-selectors-4] Selector for element with another element as ancestor (#9130)

dpk has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-selectors-4] Selector for element with another element as ancestor ==
Rough proposal: a pseudo-class, such as `p:within(a)` selects `p` elements which have an `a` element anywhere in their ancestor tree.

E.g. it would select any of the `<p>` elements here:
```html
<div>
  <a href="http://example.org/">
    <p>I match
  </a>
</div>

<a href="http://example.org/">
  <div>
    <p>I match
  </div>
</a>
```

But not this one:

```
<div>
  <p>I don’t match, <a href="http://example.org/">me neither</a>
</div>
```

While writing my first major design using CSS Nesting, this seemed like a missing feature, mainly for maintainability but also because truly accounting for all possible nesting situations to target the element wanted using regular selectors could be tricky within a complex nesting of selectors. A strong use case in particular (as implied above) is when elements might sometimes be inside links and sometimes not. This would allow them to be styled or restyled in a way more clearly indicating that they can be interacted with as links.

Link to spec: <https://www.w3.org/TR/selectors-4/>

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9130 using your GitHub account


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

Received on Monday, 31 July 2023 12:14:38 UTC