Bug 198375 - 100% height doesn't work within nested flex container
Summary: 100% height doesn't work within nested flex container
Status: RESOLVED DUPLICATE of bug 212264
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 12
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Joonghun Park
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2019-05-30 08:19 PDT by Oliver Joseph Ash
Modified: 2021-10-24 06:34 PDT (History)
8 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
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 ***