search

PolymerElements / iron-fit-behavior

Fits an element into another element
17 stars 34 forks source link

Add an `expandSizingTargetForScrollbars` property that loosens the width / height constraints if scrollbars appear after the element is positioned. #104

Closed bicknellr closed 3 years ago

bicknellr commented 3 years ago

When iron-fit-behavior takes the initial measurement of the element it intends to position, the element is positioned at position: fixed; top: 0; left: 0; and may have overflow: hidden; applied by (e.g.) iron-dropdown. Both of these situations can cause the element not to have overflowing content when this measurement is taken, even if the element would have overflowing content after it is positioned. If the element does have overflowing content after being positioned and having its max-width / max-height constrained, the size of the added scrollbars take space from the measured natural size of the content and can force the content to wrap awkwardly, even when there is enough space such that this wouldn't be necessary.

This PR works around this issue (in basically the same way as #82) by measuring again after the initial positioning: if a scrollbar appears, it adjusts the position and max-width / max-height to account for this (continuing to respect the fitInto bounds and alignment).

This feature is gated behind the expandSizingTargetForScrollbars property, since expanding the max-width / max-height to account for scrollbars isn't always desirable - for example, if the element being sized is intentionally set to a particular size to align with another element.

Fixes #81.

bicknellr commented 3 years ago

The 're-request review' button isn't doing anything (maybe a GitHub org membership thing?) so I'll just ping you in the top level comments like this I guess. Anyways, PTAL @helenxywu