Polymer - innerHTML - can I apply styles of parent element?
<p>As you probably know - Polymer prohibits the unescapedHTML binding for many reasonable reasons.</p>

<p><a href="https://stackoverflow.com/questions/22199662/how-to-inject-html-into-a-template-with-polymer/22208332#22208332">How to inject HTML into a template with polymer</a></p>

<p><a href="https://stackoverflow.com/questions/22311574/how-to-display-html-inside-template/22311788#22311788">How to display html inside template?</a></p>

<p>However in my project it was a requirement to apply HTML from external source.</p>

<p>Therefore I've implemented a component named &lt;echo-html&gt;:</p>

<pre><code>&lt;dom-module id="echo-html"&gt;
    &lt;template&gt;
        &lt;style&gt;
        &lt;/style&gt;
    &lt;/template&gt;
&lt;/dom-module&gt;

&lt;script&gt;
(function() {
    Polymer({
        is: 'echo-html',
        properties: {
            html: {
                type: Object,
                value: '',
                observer: '_refreshHtml'
            },
        },

        _refreshHtml: function() {
            if (this.html) {
                var value = '';
                var container = Polymer.dom(this).parentNode;

                if ((this.html.constructor == Array) &amp;&amp; (this.html.length == 1)) {
                    value = this.html[0];
                } else  {
                    value = this.html;
                }
                if (this.parentNode) {
                    this.outerHTML = value;
                }

                this.scopeSubtree(container, true);
                $(this).removeClass('echo-html');
            }
        },
    });
})();
&lt;/script&gt;
</code></pre>

<p>The problem I have is this component binds exactly the pure HTML, so when I want to use &lt;p&gt; or &lt;strong&gt; or any other element, I can't simply use parent's component styling and therefore needs to use global styles.</p>

<p>Is there any way to apply styles of parent element, so for example:</p>

<pre><code>&lt;parent-element&gt;
    &lt;echo-html html$="{{some-nasty-html}}"&gt;&lt;/echo-html&gt;
&lt;/parent-element&gt;
</code></pre>

<p>The "some-nasty-html" will include <code>.parent-element</code> class on it?</p>

<p>Is there any way I can remove the <code>.echo-html</code> class as well? Actually this is my question :)</p>