All geek questions in one place

External style bleeds into my local DOM polymer component

In my index.html, I import my Polymer custom element and bind the loading stylesheet. If I check my custom element and its local DOM, I see that the bootstrap style starts on it. Is this because the shadow DOM polyfill Polymer ( shady DOM ) does not support encapsulation?

I tried to set Polymer to global DOM configuration on "shadow", but that didn’t help (maybe because m using Safari and THAT does not support shadow DOM yet, but I linked the full WebComponents library , so it should be polyfill that).

Searching in SO, I found this question: External CSS that affects the "shadow DOM" on the "Polymer" ("bleeding" in "), but it is associated with version 0.5 of the Polymer , so I don’t know how relevant it is to me right now .

+4
source share
3 answers

Known Limitations

  • CSS encapsulation is limited.

This is a known limitation of the Shadow DOM polyfill.

+3
source

Shadow DOM Polymer 1.0. , DOM, , , . . , , . .

+2

, Shady DOM jQuery. DOM, - .

Polymer DOM, , , polyfill webcomponents.js , , .

0

Source: https://habr.com/ru/post/1599697/

More articles:


All Articles