1210638 - align-content should have no effect on single row/column flex layout

Status: RESOLVED DUPLICATE of bug 1000957

(Core :: Layout, defect)

Description

[rinick]

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36

Steps to reproduce:

http://jsfiddle.net/t0wL56pm/5/

this is an example of a single row flex layout,


Actual results:

the red box is aligned to the top, because of align-content: flex-start; 


Expected results:

w3c document says ` align-content has no effect on a single-line flex container.`
so the red box should be in vertical center since it has align-items: center;
this is also the result of other browsers, bug only happens in firefox

Comment 1

[rinick]

oh, sorry about the typo, the ti

Comment 2

[rinick]

this bug only happens if the parent div's size is defined by min-height.
if I change that to just height, firefox works correctly

Comment 3

[Daniel Holbert [:dholbert]]

Yup, looks like a bug -- thanks for reporting!

Quick overview of the relevant spec-text, from the editor's draft:
https://drafts.csswg.org/css-flexbox-1/#algo-cross-line

   # If the flex container is single-line and has a definite cross size,
   # the cross size of the flex line is the flex container’s inner cross size.
(This  ^ is what makes us do the right thing when you use "height" -- that establishes a "definite cross size" on the container.)

   # Otherwise, for each flex line:
   #   [...spec text on sizing each line to fit its flex items]
   # If the flex container is single-line, then clamp the line’s cross-size
   # to be within the container’s computed min and max cross-size properties.

My bet is we're skipping this clamping mentioned at the end here, likely because that clamping text wasn't present in older spec versions, e.g. this most recent working draft:
http://www.w3.org/TR/2014/WD-css-flexbox-1-20140325/#algo-cross-line
So, this is a spec change (and quite a reasonable one).

With that clamping implemented, we'll end up with the expected behavior -- the line will be as tall as the container, so align-content will have no effect (because there's no free space for it to work with).

Comment 4

[yisibl]

Firefox 53 seems to have fixed!

Comment 5

[Daniel Holbert [:dholbert]]

Yay!

Actually, based on comment 3, I'm 99% sure this is just a duplicate of bug 1000957 (which was fixed recently-ish, in Firefox 51).  Marking as such.