RE: [css3-flexbox] auto margins and flex-align: baseline

± From: tc@google.com [mailto:tc@google.com] On Behalf Of Tony Chang
± Sent: Wednesday, April 04, 2012 12:51 PM
± 
± I think the combination of auto margins and flex-align: baseline is going to 
± cause an extra pass through flex items.
± 
± ...
± 
± I see a few ways to handle this:
± 1) Do an extra pass after margin:auto to determine the new max ascent.  This 
± works, but it's slow.
± 2) margin: auto always causes flex-align/flex-pack to be ignored so we can 
± ignore it when computing the max ascent.
± 3) Maybe only have margin: auto apply to the main axis direction?  I'm not 
± sure how many web developers are going to expect margin auto to work in the 
± cross direction.

Actually it is (2), as currently defined in the spec:

	* Through calculations of preferred sizes and flexible
        lengths, auto margins are considered to be zero. 

	* Immediately before pack and align steps, if there are 
        any auto margins on items in the direction of alignment 
        and there is positive free space, the free space is 
        distributed equally to the auto margins. 

	* If free space was distributed to auto margins, the 
        following pack or align step has no effect.

The intent of the condition "if there is positive free space" is to keep flex items aligned uniformly when there isn't any free space and auto margins were of no use.

It looks like there may be a circular dependency problem with baseline (in particular when flexbox cross-size is auto), and even if there isn't a circular dependency, precise solution may be complicated.

The options I see here:

a) The option (1) above - recalculate baseline without items that have auto margins in effect. I don't think I care about performance here (this is rare, and this extra "pass" is not relayout, it is enumeration of an array of layout results), but the result may be ambiguous or have a discontinuity between positive and negative extra space

b) If an item has auto margins in cross direction, don't ever apply baseline alignment to it. Treat 'baseline' as 'center' and do that in case of overflow.

c) Calculate baseline accounting for all items, including the ones which end up aligned with margins. Don't change the baseline when any of the items are not aligned with it. 

I think I would prefer (c). It is simple and it will very rarely have a result that is noticeably different from multi-pass. Also, changing margins from 0 to 'auto' on any item doesn't change STF cross-size of flexbox (and 
that is true for all other kinds of alignment)

Alex

Received on Wednesday, 4 April 2012 23:39:16 UTC