Комбинаторы CSS по границе теневого DOM's <использование> ⇐ CSS

[Anonymous]

Этот код дает синий текст в Chrome, но черный в Firefox: < /p>

Код: Выделить всё

body:has(:checked) .my-text {
fill: blue;
}< /code>




This is blue in Chrome, black in Firefox
This is black

Вероятно, потому что Firefox помещает элементы, на которые ссылаются Inside #shadow-root и не считают их потомками в CSS. Inside "src =" https://i.sstatic.net/26wpudbm.png "/>
Есть ли способ заставить это работать в Firefox без JS или CSS -переменных (

Код: Выделить всё

:checked { --text-color: blue; }

)?
Может быть, комбинаторы CSS могут каким -то образом преодолеть разрыв между Dom (где: had (: cherced) is) и теневой Dom?>

Подробнее здесь: https://stackoverflow.com/questions/796 ... m-boundary