|
|
||
|---|---|---|
| .. | ||
| .github | ||
| classes | ||
| demo | ||
| test | ||
| .bower.json | ||
| .travis.yml | ||
| CONTRIBUTING.md | ||
| GUIDE.md | ||
| README.md | ||
| bower.json | ||
| index.html | ||
| iron-flex-layout-classes.html | ||
| iron-flex-layout.html | ||
README.md
<iron-flex-layout>
The <iron-flex-layout> component provides simple ways to use
CSS flexible box layout,
also known as flexbox. This component provides two different ways to use flexbox:
- Layout classes. The layout class stylesheet provides a simple set of class-based flexbox rules, that let you specify layout properties directly in markup. You must include this file in every element that needs to use them.
Sample use:
<div class="layout horizontal layout-start" style="height: 154px">
<div>cross axis start alignment</div>
</div>
- Custom CSS mixins.
The mixin stylesheet includes custom CSS mixins that can be applied inside a CSS rule using the
@applyfunction.
Please note that the old /deep/ layout classes
are deprecated, and should not be used. To continue using layout properties
directly in markup, please switch to using the new dom-module-based
layout classes.
Please note that the new version does not use /deep/, and therefore requires you
to import the dom-modules in every element that needs to use them.
A complete guide to <iron-flex-layout> is available.