The ::part spec says that all pseudo-elements are allowed after ::part(). This includes ::slotted(), although it's a bit difficult to make it work, and it's not clear to me that it's useful.
Gecko and Chrome currently don't accept ::slotted() after ::part() (also see #10786). WebKit does, but it doesn't appear to match in cases where I think it ought to (if I'm doing it right!).
See this testcase, where my theory is that all of the border, color, and background styles should work:
<!DOCTYPE HTML>
<style>
#host::part(main) { display: block; border: medium solid green; }
#host::part(main)::slotted(.item) { background: lime }
</style>
<div id="host">
<template shadowrootmode="open">
<style>
slot[part="main"]::slotted(.item) { color: orange }
</style>
<slot part="main"></slot>
</template>
<p class="item">One</p>
</div>Should this work?
(The "is it syntactically valid" aspects of this decision, pending #10786, also apply to part-like pseudo-elements, although it probably would never work for any of them.)
The
::partspec says that all pseudo-elements are allowed after::part(). This includes::slotted(), although it's a bit difficult to make it work, and it's not clear to me that it's useful.Gecko and Chrome currently don't accept
::slotted()after::part()(also see #10786). WebKit does, but it doesn't appear to match in cases where I think it ought to (if I'm doing it right!).See this testcase, where my theory is that all of the border, color, and background styles should work:
Should this work?
(The "is it syntactically valid" aspects of this decision, pending #10786, also apply to part-like pseudo-elements, although it probably would never work for any of them.)