Re: [css3-flexbox] Flexbox issues

--------------------------------------------------
From: "Tab Atkins Jr." <jackalmage@gmail.com>
Sent: Tuesday, April 13, 2010 12:05 PM
To: "www-style list" <www-style@w3.org>
Subject: Re: [css3-flexbox] Flexbox issues

> On Tue, Apr 13, 2010 at 11:51 AM, Tab Atkins Jr. <jackalmage@gmail.com> 
> wrote:
>> 2. `box-align: stretch` does not allow sufficient control over the
>> alignment of the box contents after the height is increased.  I guess
>> the children just act like normal boxes, and top-align themselves?
>> This prevents us from, say, baseline-aligning boxes but still wanting
>> a background/border to be the same height on everything.  I suggest
>> that either 'stretch' should be a valid value *in addition to* the
>> other values, or that we should define vertical-align affecting
>> flexbox children similarly to how it affects table cells.
>
> Alternately, box-align seems like it could be nearly completely
> replaced by directly introducing a flex unit.  The 'start', 'end', and
> 'center' values can be replaced by a flex unit on the margin, and
> 'stretch' can be replaced by a flex unit on the padding.  I know that
> flex units have been rejected in the past as needing too much work to
> specify precisely, but I'd be willing to put in the work to see them
> specified properly at least within the context of flexbox, and further
> to see how well we could specify them in other contexts.
>
> The 'baseline' value doesn't seem reproducible with flexes, though.
> Is this important?  Is it reasonable to still specify a baseline
> alignment in some other way?
>

In case of flex units and 'flow' property we can use [1]
CSS property 'clear' with its standard values and exactly
with the same meaning. No new entities are required.

This:

div.container { flow:horizontal-flow; }
div.container > * { width:*; height:*; }
div.container > :nth-child(2n+1) { clear:right; }

will replace children of div.container in rows having two
elements each. In each row elements will have same height
equal to tallest element in the row. All "cells" will have the
same width. If min/max-width set then elements will flex
in given limits.

Flow & Flexes proposal, paragraph 3.3:
http://www.terrainformatica.com/w3/flex-layout/flex-layout.htm

-- 
Andrew Fedoniouk

http://terrainformatica.com

Received on Wednesday, 14 April 2010 06:00:41 UTC