NEW55426
Elements with height 100% do not fill offset parents that are using box flex 
https://bugs.webkit.org/show_bug.cgi?id=55426
Summary Elements with height 100% do not fill offset parents that are using box flex
Ryan Fioravanti
Reported 2011-02-28 16:48:21 PST
In the test page you can easily see the problem http://jsfiddle.net/GLex5/1/ I have an element with height 100% It has a parent with position relative and webkit-box-flex: 1 The child element does not expand to fill the parent
Attachments
Add attachment proposed patch, testcase, etc.
Brandon
Comment 1 2011-12-05 13:05:35 PST
Here is a similar example without any position relative in it. This fiddle: http://jsfiddle.net/GLex5/1/ inner2 should fill up the entire blue box below inner1 since it has a 100% height and its parent was implicitly given a height from the flex-box. The developer toolbar shows that middle2 has a height of 172px but inner2 only has a height of 24px. Firefox gets it right. Seems like the height/width properties are evaluated before the flexbox sizing occurs on the parents.
hdn
Comment 2 2014-11-12 05:40:52 PST
This bug is still alive and well, found in Chrome 38 on windows 8 and Safari 8 on Yosemite and iOS 8. Here's a demonstration of the bug: http://jsfiddle.net/rpmgau47/ Works as expected in FireFox 33 and Internet Explorer 11.
hdn
Comment 3 2014-11-12 05:42:17 PST
Heres a -webkit prefixed version for Safari... http://jsfiddle.net/rpmgau47/1
Brent Fulgham
Comment 4 2022-07-12 14:23:59 PDT
Chrome and Firefox agree on this. Safari fails the test.
Radar WebKit Bug Importer
Comment 5 2022-07-12 14:24:25 PDT
<rdar://problem/96910322>
Note You need to log in before you can comment on or make changes to this bug.