WIP - Pinpoint - New Page.

third_party/polymer/components/iron-flex-layout/README.md

Index: third_party/polymer/components/iron-flex-layout/README.md
diff --git a/third_party/polymer/components/iron-flex-layout/README.md b/third_party/polymer/components/iron-flex-layout/README.md
index db013a2397c8e2031cbb36fae2dcb1c01e6ec372..d5aac2fbc0080fc66e65290585d465ff23e38af5 100644
--- a/third_party/polymer/components/iron-flex-layout/README.md
+++ b/third_party/polymer/components/iron-flex-layout/README.md
@@ -1,7 +1,7 @@
 [![Build status](https://travis-ci.org/PolymerElements/iron-flex-layout.svg?branch=master)](https://travis-ci.org/PolymerElements/iron-flex-layout)
 [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://beta.webcomponents.org/element/PolymerElements/iron-flex-layout)
 
-##<iron-flex-layout>
+## <iron-flex-layout>
 
 The `<iron-flex-layout>` component provides simple ways to use
 [CSS flexible box layout](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes),
@@ -14,13 +14,41 @@ in every element that needs to use them.
 
 Sample use:
 
-   <link rel="import" href="../iron-flex-layout/iron-flex-layout-classes.html">
+<!--
+```
+<custom-element-demo>
+  <template>
+    <script src="../webcomponentsjs/webcomponents-lite.min.js"></script>
+    <link rel="import" href="iron-flex-layout-classes.html">
+    <dom-module id="demo-element">
+      <template>
+        <style is="custom-style" include="iron-flex iron-flex-alignment"></style>
+        <style>
+          .container, .layout {
+            background-color: #ccc;
+            padding: 4px;
+          }
 
-   <style is="custom-style" include="iron-flex iron-flex-alignment"></style>
-
-   <div class="layout horizontal layout-start">
-     <div>cross axis start alignment</div>
-   </div>
+          .container div, .layout div {
+            background-color: white;
+            padding: 12px;
+            margin: 4px;
+          }
+        </style>
+        <next-code-block></next-code-block>
+      </template>
+      <script>Polymer({is: "demo-element"});</script>
+    </dom-module>
+    <demo-element></demo-element>
+  </template>
+</custom-element-demo>
+```
+-->
+```html
+<div class="layout horizontal layout-start" style="height: 154px">
+  <div>cross axis start alignment</div>
+</div>
+```
 
 1. [Custom CSS mixins](https://github.com/PolymerElements/iron-flex-layout/blob/master/iron-flex-layout.html).
 The mixin stylesheet includes custom CSS mixins that can be applied inside a CSS rule using the `@apply` function.