- From: Andy Earnshaw via GitHub <sysbot+gh@w3.org>
- Date: Tue, 10 Oct 2023 10:39:15 +0000
- To: public-css-archive@w3.org
I'd also like to see the function-style `:has-slotted(*)`, too. I'm building out some components where the default styling for the host is `display: flex`. The `<slot>` elements are direct children of the shadow root and become part of the `flex` layout. However, this causes a complication where the consumer is forced to wrap text nodes in an element in order to get the correct layout on them. Since `:has-slotted(*)` would match a slot with anything but text nodes slotted, I could do something like this:
```css
.my-slot:not(:has-slotted(*)) {
display: block;
}
```
I feel this gives a little more flexibilty and power to make custom elements a little more ergonomic. There are potential other use cases, such as internal shadow tree styling based on an invalid slotted form field or an `<a>` with a missing `href` attribute, for example.
--
GitHub Notification of comment by andyearnshaw
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6867#issuecomment-1754972733 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 10 October 2023 10:39:17 UTC