I've been working an issue where Safari somehow messes up the character
encoding in the CSS included in an element definition:
<polymer-element name="ui-icon">
<template>
<style>
:host {
font-family: FontAwesome;
content: "\f097";
}
</style>
</template>
</polymer-element>
Safari tries to decode "\f097" too early, and the icon doesn't work.
The resolve was to separate the styles into an external, document level
stylesheet:
ui-icon {
font-family: FontAwesome;
content: "\f097";
}
According to the Polymer docs on styling:
Because polyfilling the styling behaviors of Shadow DOM is difficult,
> Polymer has opted to favor practicality and performance over correctness.
> For example, the polyfill’s do not protect Shadow DOM elements against
> document level CSS.
Does this mean that with native ShadowDOM support, my ui-icon select will
not find its element if it's inside a ShadowDOM? My tests so far seem to
indicate that it does (with the experimental web features flag on in
Canary), so I'm wondering if Polymer is hacking the native implementation
to be consistent, or what exactly is going on.
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/d5a438a4-2e4b-4bec-803b-19053bfad955%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
