In a browser like Chrome, the markup inside an element's shadow root is not
visible to the rest of the page. But in browsers like Firefox and Safari,
this is not the case. So all of the divs and other bits of markup inside a
polymer element are going to be in the main document when you view your
site on Firefox or Safari. This means if you write a very loose style
selector like:
div {
background: red;
}
It will turn every div (even those inside Polymer elements) red, if you're
in a browser like Firefox or Safari. The Shadow DOM polyfill cannot create
true style scoping in browsers which lack support (like Firefox, for
instance). If you are creating a Polymer element, named x-foo, and you put
styles inside of that element, the polyfill will try to help you out by
prefixing those styles with your element name.
For example:
// in x-foo.html
:host div {
background: red;
}
becomes:
x-foo div {
background: red;
}
This is useful, but it's not bulletproof, and it means you have to be
careful how you write the rest of the styles on your page so you don't
accidentally override the styles inside of the elements.
On Mon, Dec 29, 2014 at 11:27 AM, <[email protected]> wrote:
> Sorry, but I feel I need to bump this.
>
> Its a serious issue, if its true, but I am hoping its not?
>
>
> On Tuesday, December 16, 2014 12:21:17 AM UTC+1, [email protected] wrote:
>>
>> Hey,
>> I have posted two questions on Stackoverflow. Both of them points out
>> that I cannot get Polyfill to work for my specific web site in Firefox or
>> in Chrome on iOS, and I cannot figure out why. The Topeka app works fine in
>> Firefox, but my site does not.
>>
>> Any tips or advice from the Polymer team would be greatly appreciated.
>>
>> *Polymer: Layout screwed up in Firefox, fine in Chrome*
>> http://stackoverflow.com/questions/27480345/polymer-
>> layout-screwed-up-in-firefox-fine-in-chrome
>>
>> *Polymer in Chrome for iOS - it is not working, right?*
>> http://stackoverflow.com/questions/27482513/polymer-in-
>> chrome-for-ios-it-is-not-working-right
>>
>> Also, I uploaded the stuff here:
>> http://misc.snapcode.se/polymer
>>
>> Can anyone see what I am doing wrong here?
>>
> Follow Polymer on Google+: plus.google.com/107187849809354688692
> ---
> You received this message because you are subscribed to the Google Groups
> "Polymer" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/e3e69f44-9611-4513-bdb9-616edc0c9afa%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/e3e69f44-9611-4513-bdb9-616edc0c9afa%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
>
> For more options, visit https://groups.google.com/d/optout.
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/CAJj5OwCgYC9bQcf%2BnNZ7vybKUjwwePJtN4gVQ_n8ceNHetpMfA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
