W3C home > Mailing lists > Public > www-style@w3.org > February 2012

RE: [css3-grid] [css3-flexbox] Stretch alignment in flexbox and grid

From: Phil Cupp <pcupp@microsoft.com>
Date: Wed, 15 Feb 2012 09:04:31 +0000
To: Tab Atkins Jr. <jackalmage@gmail.com>
CC: "www-style@w3.org" <www-style@w3.org>, Alex Mogilevsky <alexmog@microsoft.com>, "fantasai (fantasai.lists@inkedblade.net)" <fantasai.lists@inkedblade.net>
Message-ID: <58A081B0F3FA704EAB1082E64639BB010A41516F@TK5EX14MBXC284.redmond.corp.microsoft.com>
I'm glad we agree the example rendering is correct.  That sounds great.

Regarding justify, I thought for a minute (incorrectly) that there might be another opportunity to apply some similar box-model equation i.e. sum the main size + applicable mbp for each item in the same line so that it totals to the width of the flexbox.  I see now that's not the case so just disregard (though I appreciate Alex's efforts to turn my stray thought into a clever new feature - feel free to pursue that line of thinking as you see fit ;-)


From: Tab Atkins Jr. [jackalmage@gmail.com]
Sent: Tuesday, February 14, 2012 2:04 PM
To: Phil Cupp
Cc: www-style@w3.org; Alex Mogilevsky; fantasai (fantasai.lists@inkedblade.net)
Subject: Re: [css3-grid] [css3-flexbox] Stretch alignment in flexbox and grid

On Mon, Feb 13, 2012 at 11:49 AM, Phil Cupp <pcupp@microsoft.com> wrote:
> I saw in the minutes from Paris discussion about margins and
> flex-item-align.  I didnít see any mention of stretch alignment though which
> is what I think makes the treatment of margins interesting.  In the grid,
> stretch alignment mimics the way that stretching a block elementís width in
> the normal flow works[1] (except we drop the paragraph that says it should
> be dropped).  That applies to both the width and height of grid items when
> they have grid-column-align or grid-row-align stretch.  If flex-item-align
> behaves the same way, then I think we have a consistent algorithm for
> stretching an itemís box so that it touches the edges of the space afforded
> to it by its parent layout.

Yes, your example rendering is correct.  It matches what Flexbox will
say once I make the margin-related edits.

> Note I think the same rules should probably
> apply to flex-pack: justify as well, since it seems like another form of
> stretching.

I don't understand.  flex-pack:justify doesn't stretch anything - it
distributes the free space around the items.  The analogue of
"stretch" in the main axis is making the item flexible.
(flex-align:stretch is just the keyword version of making the
cross-size flexible.)

I think auto margins should continue to resolve to 0 in the main axis.
Flexible margins are incompatible with multi-line flexboxes - *none*
of the flex-pack values can be simulated with margins in a multi-line
flexbox unless you know precisely where breaks will occur ahead of
time. Flexible margins *can* do somewhat useful things in a
single-line flexbox (they can be used to simulate XUL springs), but I
don't think it's worth it to include them.

(I don't really think that flexible auto margins in the cross axis are
worth it, either, but Alex seems to feel strongly, and I don't have a
technical argument against them, just an aesthetic one.)

Received on Wednesday, 15 February 2012 09:06:10 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:12 UTC