Re: [css3-flexbox] flex-pack distribute bikeshed

On Thu, Sep 15, 2011 at 2:04 PM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> On Wed, Sep 14, 2011 at 4:07 PM, Ojan Vafai <ojan@chromium.org> wrote:
> > I understand the desire to use distribute for flex-pack since it can be
> > vertical as well, but I think justify is a more well understood term and
> I
> > don't foresee people finding the concept of justifying vertically
> confusing.
> > The meaning is obvious.
> > WebKit already implemented it with 'justify' based on the previous state
> of
> > the spec and I'm loathe to change the name to something that's IMO more
> > confusing.
>
> So, I looked back at my commit history, and that change shows up with
> the commit message "Change flex-pack:justify to distribute, to match
> Grid.".  Grid has no such thing.  Thus, I'm pretty sure I was on crack
> at the time.
>
> I think Fantasai may have suggested changing it, because it's not
> exactly the same as justification.  Text justification only triggers
> when the text is "close enough" to a full line, while
> flex-pack:distribute always triggers.
>

I hadn't thought of the wrapping case. I think we want the same behavior as
text justification here as well. The use-case I have in mind is a toolbar
that wraps:
<button><button><input
style="width:flex(1);min-width:100px;max-width:200px"><button><button>

So, you have two non-flexing buttons on either side of an input that flexes,
but when you make the container small, you want the buttons to wrap, instead
of overflow.

justify:
button button input
button button

distribute:
button button input
button       button

The justify behavior is clearly what you want in this use-case. Is there a
multiline case where you actually want the distribute behavior?

Received on Thursday, 15 September 2011 21:19:46 UTC