1 2<!--- 3 4This README is automatically generated from the comments in these files: 5iron-fit-behavior.html 6 7Edit those files, and our readme bot will duplicate them over here! 8Edit this file, and the bot will squash your changes :) 9 10The bot does some handling of markdown. Please file a bug if it does the wrong 11thing! https://github.com/PolymerLabs/tedium/issues 12 13--> 14 15[](https://travis-ci.org/PolymerElements/iron-fit-behavior) 16 17_[Demo and API docs](https://elements.polymer-project.org/elements/iron-fit-behavior)_ 18 19 20##Polymer.IronFitBehavior 21 22`Polymer.IronFitBehavior` fits an element in another element using `max-height` and `max-width`, and 23optionally centers it in the window or another element. 24 25The element will only be sized and/or positioned if it has not already been sized and/or positioned 26by CSS. 27 28| CSS properties | Action | 29| --- | --- | 30| `position` set | Element is not centered horizontally or vertically | 31| `top` or `bottom` set | Element is not vertically centered | 32| `left` or `right` set | Element is not horizontally centered | 33| `max-height` set | Element respects `max-height` | 34| `max-width` set | Element respects `max-width` | 35 36`Polymer.IronFitBehavior` can position an element into another element using 37`verticalAlign` and `horizontalAlign`. This will override the element's css position. 38 39```html 40 <div class="container"> 41 <iron-fit-impl vertical-align="top" horizontal-align="auto"> 42 Positioned into the container 43 </iron-fit-impl> 44 </div> 45``` 46 47Use `noOverlap` to position the element around another element without overlapping it. 48 49```html 50 <div class="container"> 51 <iron-fit-impl no-overlap vertical-align="auto" horizontal-align="auto"> 52 Positioned around the container 53 </iron-fit-impl> 54 </div> 55``` 56 57 58
){kind=link}