Closed
Bug 1111178
Opened 10 years ago
Closed 10 years ago
flexbox layout bug (non-interop against Chrome & IE)
Categories
(Core :: Layout, defect)
Tracking
()
RESOLVED
INVALID
People
(Reporter: daniel, Unassigned)
References
Details
Attachments
(1 file)
929 bytes,
text/html
|
Details |
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36 Steps to reproduce: go to http://jsfiddle.net/0wdwg8ch/ or open the attached repro Chrome version tested: 39.0.2171.95 IE version tested: 11.0.9600.17498 Firefox version tested:34.0.5 Actual results: Footer item is placed at the bottom of the middle flex item (which is overflowing and does not fit into the flex box) Expected results: Footer item is placed at the bottom of the flex parent (like in IE, Chrome)
Comment 1•10 years ago
|
||
Styling #main with min-height:0 makes the rendering match Chrome. So this looks like yet another instance of min-height defaulting to "auto" on flex items instead of 0. That's a recent spec change that we've updated to but Chrome and IE haven't yet.
Blocks: minsizeauto-fallout
Reporter | ||
Comment 2•10 years ago
|
||
(In reply to Boris Zbarsky (Vacation Dec 15-31) [:bz] from comment #1) > Styling #main with min-height:0 makes the rendering match Chrome. So this > looks like yet another instance of min-height defaulting to "auto" on flex > items instead of 0. That's a recent spec change that we've updated to but > Chrome and IE haven't yet. I appreciate the fast response. This allows me to deploy a one-line fix that fixes the issue on my page. Hopefully the spec will stabilize and reach CR soon.
Comment 3•10 years ago
|
||
Yup, we're matching the spec here (and Chrome is not). (IE Tech Preview probably matches our rendering, too, as they've implemented "min-width:auto" there.) Specifically, we're seeing the "height: 200px" on ".main" (which the spec calls the "clamped size" in its diagram / description at http://dev.w3.org/csswg/css-flexbox/#min-size-auto ) and we're using that as the min height, and refusing to shrink smaller than that. As bz indicates, you can override this by providing a different "min-height" value (since this behavior is triggered by the new default "min-height:auto" value.)
Status: UNCONFIRMED → RESOLVED
Closed: 10 years ago
Resolution: --- → INVALID
Comment 4•10 years ago
|
||
(In reply to Daniel Holbert [:dholbert] from comment #3) > Yup, we're matching the spec here (and Chrome is not). (IE Tech Preview > probably matches our rendering, too, as they've implemented "min-width:auto" > there.) (Sorry, I meant "min-width:auto *and* "min-height:auto" -- it's really "min-height" that matters in this case, of course.)
You need to log in
before you can comment on or make changes to this bug.
Description
•