| OLD | NEW |
| 1 | 1 |
| 2 <!--- | 2 <!--- |
| 3 | 3 |
| 4 This README is automatically generated from the comments in these files: | 4 This README is automatically generated from the comments in these files: |
| 5 iron-fit-behavior.html | 5 iron-fit-behavior.html |
| 6 | 6 |
| 7 Edit those files, and our readme bot will duplicate them over here! | 7 Edit those files, and our readme bot will duplicate them over here! |
| 8 Edit this file, and the bot will squash your changes :) | 8 Edit this file, and the bot will squash your changes :) |
| 9 | 9 |
| 10 The bot does some handling of markdown. Please file a bug if it does the wrong | 10 The bot does some handling of markdown. Please file a bug if it does the wrong |
| 11 thing! https://github.com/PolymerLabs/tedium/issues | 11 thing! https://github.com/PolymerLabs/tedium/issues |
| 12 | 12 |
| 13 --> | 13 --> |
| 14 | 14 |
| 15 [](https://travis-ci.org/PolymerElements/iron-fit-behavior) | 15 [](https://travis-ci.org/PolymerElements/iron-fit-behavior) |
| 16 | 16 |
| 17 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-fit-beha
vior)_ | 17 _[Demo and API docs](https://elements.polymer-project.org/elements/iron-fit-beha
vior)_ |
| 18 | 18 |
| 19 | 19 |
| 20 ##Polymer.IronFitBehavior | 20 ##Polymer.IronFitBehavior |
| 21 | 21 |
| 22 Polymer.IronFitBehavior fits an element in another element using `max-height` an
d `max-width`, and | 22 `Polymer.IronFitBehavior` fits an element in another element using `max-height`
and `max-width`, and |
| 23 optionally centers it in the window or another element. | 23 optionally centers it in the window or another element. |
| 24 | 24 |
| 25 The element will only be sized and/or positioned if it has not already been size
d and/or positioned | 25 The element will only be sized and/or positioned if it has not already been size
d and/or positioned |
| 26 by CSS. | 26 by CSS. |
| 27 | 27 |
| 28 | CSS properties | Action | | 28 | CSS properties | Action | |
| 29 | --- | --- | | 29 | --- | --- | |
| 30 | `position` set | Element is not centered horizontally or vertically | | 30 | `position` set | Element is not centered horizontally or vertically | |
| 31 | `top` or `bottom` set | Element is not vertically centered | | 31 | `top` or `bottom` set | Element is not vertically centered | |
| 32 | `left` or `right` set | Element is not horizontally centered | | 32 | `left` or `right` set | Element is not horizontally centered | |
| 33 | `max-height` or `height` set | Element respects `max-height` or `height` | | 33 | `max-height` set | Element respects `max-height` | |
| 34 | `max-width` or `width` set | Element respects `max-width` or `width` | | 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 posi
tion. |
| 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 |
| 47 Use `noOverlap` to position the element around another element without overlappi
ng 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 ``` |
| 35 | 56 |
| 36 | 57 |
| OLD | NEW |