- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Thu, 15 Sep 2011 14:48:03 -0700
- To: Ojan Vafai <ojan@chromium.org>
- Cc: www-style@w3.org, fantasai <fantasai.lists@inkedblade.net>
On Thu, Sep 15, 2011 at 2:28 PM, Ojan Vafai <ojan@chromium.org> wrote: > 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? Oh man, really? I think this is a lot better than the justification example: distribute: +---------------------------+ |button button input| |button button| +---------------------------+ I mean, neither one's very great, but the justify seems *really* bad here. The distribute case looks way better when the last line has more than two entries in it: justify: +--------------------------------------------------------+ |button button button button button button| |button button button button | +--------------------------------------------------------+ distribute: +--------------------------------------------------------+ |button button button button button button| |button button button button| +--------------------------------------------------------+ I think justify is just *horrid* here. Ideally you'd like it to look something like this: flexgrid: +--------------------------------------------------------+ |button button button button button button| |button button button button | +--------------------------------------------------------+ (We're debating behavior at this point, not naming. We can use the 'distribute' behavior and call it 'justify', or vice versa.) > 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. Yeah, distribute and multiline aren't great together. You *really* want a flexgrid, which is on my pile of things to work on, somewhere near the bottom. In some simple cases it's okay, though. For example, making a multiline flexbox where you know there will be only two items per line. Three per line will probably be okay most of the time, too. ~TJ
Received on Thursday, 15 September 2011 21:49:21 UTC