{Demo and API docs}[https://elements.polymer-project.org/elements/iron-fit-behavior]

Polymer.IronFitBehavior

Polymer.IronFitBehavior fits an element in another element using max-height and max-width, and optionally centers it in the window or another element.

The element will only be sized and/or positioned if it has not already been sized and/or positioned by CSS.

| CSS properties | Action | | — | — | | position set | Element is not centered horizontally or vertically | | top or bottom set | Element is not vertically centered | | left or right set | Element is not horizontally centered | | max-height set | Element respects max-height | | max-width set | Element respects max-width |

Polymer.IronFitBehavior can position an element into another element using verticalAlign and horizontalAlign. This will override the element's css position.

<div class="container">
    <iron-fit-impl vertical-align="top" horizontal-align="auto">
      Positioned into the container
    </iron-fit-impl>
  </div>

Use noOverlap to position the element around another element without overlapping it.

<div class="container">
    <iron-fit-impl no-overlap vertical-align="auto" horizontal-align="auto">
      Positioned around the container
    </iron-fit-impl>
  </div>