1164019 - Flexbox items don't shrink if they have a sufficient large child

Status: RESOLVED INVALID

(Core :: Layout, defect)

Description

[Ulrich Homann]

Attachment: sample_layout.html

User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.52 Safari/537.36

Steps to reproduce:

An flexbox item (see sample: 'main/left/main') can't shrink if the result would be an overflow (because of the child element 'block'). Even 'overflow: hidden;' is ignored.


Actual results:

The sample layout don't shrink to the window size, the height of 'main/left/main' is never smaller that the height of the 'block' element.


Expected results:

The sample layout should shrink to the window size. The 'main/left/main' div should shrink to height zero if the window is very small.

Comment 1

[Ulrich Homann]

Note: The User Agent I've used to submit the bug (Chrome) is not the User Agent I've used to reproduce the bug (Firefox 37)

Comment 2

[Boris Zbarsky [:bzbarsky]]

Setting min-height:0 on the <div id="main"> makes it able to shrink down below its intrinsic height, as expected (the default value of min-height is "auto", not 0).

As far as I can tell, that's per current spec.  Sounds like Chrome's changes to update to the spec here are not complete yet.

Comment 3

[Daniel Holbert [:dholbert]]

Yeah, the min-content height of the outer "main" element is nonzero, so it needs "min-height:0" to override its default "min-height:auto", or else it'll be as tall as its contents' min-content size.

Chrome (dev edition, w/ min-height:auto support) indeed doesn't seem to be following the spec here; I'll file a Blink bug.

Comment 4

[Daniel Holbert [:dholbert]]

Filed https://code.google.com/p/chromium/issues/detail?id=487302 on Chrome's rendering here.