I believe you'd need to use a definite "height" value on the flex container or one of its descendants. (instead of -- or along with -- the explicit "max-height" that you're using right now) For example: https://jsfiddle.net/04o1kwfd/4/
(I suspect you may not want an explicit "height", but I don't know any way to fix the testcase without that, unfortunately.) In your provided testcase, the children's heights can't be resolved against the container's height (and can't be fit to the container-height using "align-items:stretch"), because they're really sized within their (invisible) *flex line*, which in this case is sized to the children -- not to the container. If you provide an explicit height on the flex container, then the spec mandates that this explicit height becomes the flex line's height as well -- and then the children will stretch to that size. So, that's why an explicit height helps. And the spec-change that we need to implement here would similarly constrain the height of the flex line using the max-height, as described here: https://hg.csswg.org/drafts/rev/9b2355f9ccf3#l1.10 The fix in Firefox should be a pretty simple change, I think, but unfortunately we haven't gotten to it yet. I can prioritize it to fix in the next week or so, though that still means it wouldn't reach Firefox release users for another few months (in Firefox 51, due out in late January it looks like). Not sure what that means for your particular use-case. ~Daniel On 08/07/2016 09:35 PM, Amit Zur wrote: > Thank you Daniel, > > Do you know if there's a way around it to achieve the goal of having the > content shown with auto height (and max-height) and scrollable inner > containers? > > Also, is it planned to ship in a near nightly? > > On Sunday, August 7, 2016 at 10:23:01 PM UTC+3, Daniel Holbert wrote: >> Firefox's behavior on that testcase matches an older version of the spec >> (and then the spec changed). >> >> This bug... >> https://bugzilla.mozilla.org/show_bug.cgi?id=1000957 >> ...is filed on bringing us up-to-date on that point. >> >> ~Daniel >> >> >> On 08/07/2016 05:16 AM, Amit Zur wrote: >>> Hey, >>> >>> Take a look at this fiddle: https://jsfiddle.net/04o1kwfd/1/ >>> The 2 colored panels should be taking the size of their container, and the >>> left one should have a scrollbar. >>> However in firefox they overflow the container. I'm aware of the min-size >>> issue with flex items, but no min-height that I tried would work here. >>> >>> Any ideas? >>> >>> Amit >>> _______________________________________________ >>> dev-platform mailing list >>> dev-platform@lists.mozilla.org >>> https://lists.mozilla.org/listinfo/dev-platform >>> > > _______________________________________________ > dev-platform mailing list > dev-platform@lists.mozilla.org > https://lists.mozilla.org/listinfo/dev-platform > _______________________________________________ dev-platform mailing list dev-platform@lists.mozilla.org https://lists.mozilla.org/listinfo/dev-platform
