Bug 198375

Summary:	100% height doesn't work within nested flex container
Product:	WebKit	Reporter:	Oliver Joseph Ash <oliverjash>
Component:	Layout and Rendering	Assignee:	Joonghun Park <jh718.park>
Status:	RESOLVED DUPLICATE
Severity:	Normal	CC:	alex.wayfer, bfulgham, jh718.park, mightyiampresence, samanpwbb, simon.fraser, webkit-bug-importer, zalan
Priority:	P2	Keywords:	BrowserCompat, InRadar
Version:	Safari 12
Hardware:	Unspecified
OS:	Unspecified

Description Oliver Joseph Ash 2019-05-30 08:19:37 PDT

Re. https://github.com/philipwalton/flexbugs/issues/197

Reduced test case: http://jsfiddle.net/OliverJAsh2/rx59Ljbw/2/

The `height: 100%` seems to be ignored. It works in Chrome and Firefox.

Specifying `flex-basis: 0` or `height: 0` on the flex item (as suggested originally in https://github.com/philipwalton/flexbugs/issues/197#issuecomment-283211783) seems to workaround the issue in Safari.

Comment 1 Radar WebKit Bug Importer 2019-05-31 12:55:57 PDT

<rdar://problem/51311833>

Comment 2 Joonghun Park 2021-10-24 06:34:26 PDT


*** This bug has been marked as a duplicate of bug 212264 ***