Re: [csswg-drafts] [css-scoping] @-rule to specify light DOM CSS rules within Shadow DOM styles (#10941)

Talking about this with @emilio he pointed something out: this is not always as simple as "writing CSS as if the CSS was on the outside". Consider this case:

```css
<fancier-list>
 <template shadowrootmode="open">
  <fancy-list>
   <template shadowrootmode="open">
    <slot></slot>
   </template>
   <slot></slot>
  </fancy-list>
 </template>
 <ul>
  <li>Hi</li>
 </ul>
</fancier-list>
```

The light DOM of the document is:

```html
<fancier-list>
 <ul>
  <li>Hi</li>
 </ul>
</fancier-list>
```

The light DOM inside `<fancier-list>`’s shadow root is:

```html
<fancy-list>
 <slot></slot>
</fancy-list>
```

So a selector targeting `fancy-list li` would not work in either context.
Maybe that’s okay though? Since this is a band-aid solution because we cannot have #7922 maybe it’s okay if some edge cases are missed?

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


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

Received on Thursday, 26 September 2024 22:19:55 UTC