Re: [css-flexbox] What to do with an item's height when max-height is applied to the flex container

I agree that this is unambiguous, and that the Firefox / IE behavior
matches what the spec calls for. (and Blink needs fixing on this.)

The only ambiguous part, to me, is "do we like the Blink behavior
better". :)  I kind of like it, as a logical extension of the special
case in Step 8.

If we do prefer the Blink behavior, we could extend Step 8 to say
something like this, at the end of the "Otherwise" prose:

  If the flex container has only one flex line (even if it's
  a multi-line flex container), then clamp the line's cross-size
  to be within the container's computed min and max cross-size
  properties.

This would be a trivial change to implement, and I'd be fine if we
decided to change the spec along these lines. (I don't feel strongly
about it, though.)

~Daniel

On 04/21/2014 12:50 PM, Tab Atkins Jr. wrote:
> On Mon, Apr 21, 2014 at 11:43 AM, Greg Whitworth <gwhit@microsoft.com> wrote:
>> We ran into an interesting interop issue where if you set a flex container
>> with a max-height, Firefox and IE set the flex-item height to the height of
>> the max-content of the items, while Chrome sets the max-height of the
>> flex-item to the suggested max-height applied to the flex-container. The
>> spec is not completely clear on what to do in this case so I would like to
>> reach consensus on what to do in this case:
>>
>> A)     Have the flex items inherit their height from the flex-container’s
>> constraints if not directly set (Chrome)
>>
>> B)      Resolve their height against the largest flex-item (IE, Firefox)
>>
>> Here is a fiddle of the repro:
>>
>> http://jsfiddle.net/VDq6r/6/
> 
> Can you point out what part of the spec seems ambiguous on this point?
>  It seems clear to me:
> 
> 1. In step 8, the flex container's cross size is indefinite, so we
> can't use the first clause.  We fall to the second one, which sizes
> the flex line to the largest hypothetical cross size among its items
> (150px).
> 
> 2. In step 11, the flex item is stretched and auto-sized and meets the
> other criteria, so it gets set to the size of the flex line (150px).
> 
> 3. In step 15, the flex container is set to the size of its flex line
> (150px), but clamped by its min/max properties, so it gets set to
> 100px. (This is FF's behavior, and probably IE's from your
> description.)
> 
> Is there something I've missed that makes this less cut-and-dry?
> 
> ~TJ
>

Received on Monday, 21 April 2014 19:59:11 UTC