Re: [css-flexbox] Behaviour of percentage heights in column direction

On 02/09/2015 02:23 PM, Peter Salas wrote:
> In Chrome, FF, and IE, a nested flex container will flex its children up to the given height:
> 
> http://jsfiddle.net/7s1w4wen/

That's an interesting case, but I'm not sure it's directly analogous to
the percent-height scenario.

With percent-sizing, a percent-sized element traditionally *may or may
not* have its percent size be resolvable, based on whether the parent's
size depends on the percent-sized thing.

In contrast: with flexbox & "flex" values, *whatever a flex container's
main size ends up being*, it distributes that space among its children
according to their flexibilities & the flex algorithm.  This is true
regardless of how it reaches its final size & whether that final size
depends on its children's sizes.  So, your jsfiddle is trivially correct
because of this.  (The outer flex container clearly distributes all of
its height to the inner flex container, because the inner flex container
has a flex-grow of 1. Similarly, the inner flex container clearly
distributes all of its (final) height to its item, because that item has
"flex-grow" of 1.

~Daniel

Received on Monday, 9 February 2015 23:17:41 UTC