Flexbox container using Polymer

Bower

$ bower install flex-element

npm

$ npm install flex-element

index.html

<!doctype html>
<html>
  <head>
    <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
    <link rel="import" href="bower_components/flex-element/flex-element.html">
  </head>
  <body>
    <flex-element x-center y-center>
      …
    </flex-element>
  </body>
</html>

x-axis alignment

x-start

<flex-element x-start></flex-element>

x-center

<flex-element x-center></flex-element>

x-end

<flex-element x-end></flex-element>

x-space-around

<flex-element x-space-around></flex-element>

x-space-between

<flex-element x-space-between></flex-element>

y-axis alignment

y-baseline

<flex-element y-baseline></flex-element>

y-start

<flex-element y-start></flex-element>

y-center

<flex-element y-center></flex-element>

y-end

<flex-element y-end></flex-element>

y-stretch

<flex-element y-stretch></flex-element>