Bug 282036
| Summary: | [css-flexbox] incorrect layout with max-height and flex-direction column and justify-content center | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Przemyslaw Gorszkowski <pgorszkowski> |
| Component: | Layout and Rendering | Assignee: | Przemyslaw Gorszkowski <pgorszkowski> |
| Status: | NEW | ||
| Severity: | Normal | CC: | bfulgham, karlcow, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | BrowserCompat, InRadar |
| Version: | WebKit Nightly Build | ||
| Hardware: | Unspecified | ||
| OS: | All | ||
Przemyslaw Gorszkowski
The original problem was reported in https://github.com/WebPlatformForEmbedded/WPEWebKit/issues/1417.
Here is simple test case: https://codepen.io/pgorszkowski/pen/PoMOpze
Problem exists on Safarii/WebKitGTK/WPEWebkit
Problem is not seen on Chrome/Firefox.
The main issue is when we have an nested flexbox container inside other flexbox container and the main/outside flexbox container has max-height set to smaller value than the height value set in inside container. It can be observed only in case of flex-direction: column/column-reverse and justify-content: center/space-around/space-evenly for nested container.
It seems that the max-height from the outside container is not taken into consideration when the final size(height) of the item is calculated.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Przemyslaw Gorszkowski
Pull request: https://github.com/WebKit/WebKit/pull/35859
Radar WebKit Bug Importer
<rdar://problem/138987797>