W3C home > Mailing lists > Public > www-style@w3.org > September 2011

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

From: Ojan Vafai <ojan@chromium.org>
Date: Thu, 15 Sep 2011 14:28:40 -0700
Message-ID: <CANMdWTuRO0BwP6Qji3QOEuqo4p_T_cAmOKTZL07+Qn5EDZ7FHQ@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: www-style@w3.org, fantasai <fantasai.lists@inkedblade.net>
On Thu, Sep 15, 2011 at 2:23 PM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> On Thu, Sep 15, 2011 at 2:18 PM, Ojan Vafai <ojan@chromium.org> wrote:
> > 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?
>
> I think you're obscuring the details of that case with your spacing.
> Do you really want this?
>
> justify:
> +---------------------------+
> |button     button     input|
> |button button              |
> +---------------------------+
>
> I highly doubt this is desirable.  It only looked good in your example
> above because  they were packed tightly already.
>

But the distribute case seems even worse IMO. Is there a use-case for it?

I guess in practice, people mostly won't be using distribute/justify with
multiline, but when they do, the justify behavior seems better to me, at
least for the toolbar use-case above.

Ojan
Received on Thursday, 15 September 2011 21:29:25 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:44 GMT