Re: [css-flexbox] Different behaviour in FF and Chrome regarding flex-basis

On Mon, Aug 18, 2014 at 5:25 PM, Daniel Holbert <dholbert@mozilla.com> wrote:
> On 07/23/2014 11:45 AM, Daniel Holbert wrote:
>> In Firefox, when the height is indefinite, we establish it using the sum
>> of the hypothetical main sizes of its children.  (I thought this was in
>> the spec, but I can't find it at the moment; it's possible it was in an
>> older version, or just that I'm misrememebering.)
>
> Following up on this -- this behavior ^ is indeed correct per the spec:
>
>   # The max-content main size of a flex container
>   # is the sum of the flex container’s items' max-content
>   # contributions in the main axis"
>   [...]
>   # The main-size min-content/max-content contribution of
>   # a flex item is its outer hypothetical main size when
>   # sized under a min-content/max-content constraint
>   # (respectively).
>   http://dev.w3.org/csswg/css-flexbox/#intrinsic-sizes
>
> Also, here's a modified version of the original codepen, to demonstrate
> the key difference here:
>   http://codepen.io/anon/pen/JfHdE
>
> Firefox and IE11 render this collapsed. Chrome renders it non-collapsed,
> because it seems to be using the items' auto-heights instead of their
> flex base sizes to establish the container's height.
>
> I think Firefox & IE11 are correct.
>
> The only things I changed in the codepen (w.r.t. the original one on
> this thread) are:
>   - I added "min-height:0", since otherwise Firefox Nightly honors the
> default "min-height:auto" which saves it from collapsing.
>   - I changed "flex: 1 1 0" to "1 1 0px", since IE incorrectly rejects
> "1 1 0", as I noted in [1].
>
> ~Daniel
> [1] http://lists.w3.org/Archives/Public/www-style/2014Jul/0442.html

Yeah, I agree, this is a Chrome bug.  I'll file an issue.

(Without min-size:auto, this is less friendly behavior in the common
case, but we need to implement that anyway.)

~TJ

Received on Tuesday, 19 August 2014 00:37:06 UTC