googlearchive / polymer-element-catalog

A catalog of Polymer-based web components built by the Polymer team
BSD 3-Clause "New" or "Revised" License
164 stars 91 forks source link

Missing closing tag </style> in iron-flex-layout sample code #279

Open dulimarta opened 8 years ago

dulimarta commented 8 years ago

The sample code posted at Flexbox Layout example shows the following code:

<style include="iron-flex iron-flex-alignment">

For a simple (small) project, the above style include works fine. But when I use the above code in a bigger project and combine it with other style declarations like:

<style include="iron-flex iron-flex-alignment">
<style>
  :host {
     /* other style declarations here */
  }

  /* more styles here */
</style>

I kept getting the following error

polymer-error

After debugging my code, I finally resolved the issue by adding </style>

<!-- add missing closing tag -->
<style include="iron-flex iron-flex-alignment"></style>
<style>
  :host {
     /* other style declarations here */
  }
</style>
notwaldorf commented 8 years ago

Ah, you could also just remove the second <style>, which is probably what we (me) intended to write:

<style include="iron-flex iron-flex-alignment">
  :host {
     /* other style declarations here */
  }
</style>

Would you like to send a PR to fix that? :)