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

Re: [css3-flexbox] flex-basis initial value should be 0px

From: Tony Chang <tony@chromium.org>
Date: Wed, 23 May 2012 11:04:36 -0700
Message-ID: <CAL-=4P3UzX7aXJ4aB4cKL40Q9UBYaOBrOFAX=iPbJvQPDQuixQ@mail.gmail.com>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: fantasai <fantasai.lists@inkedblade.net>, www-style@w3.org
On Wed, May 23, 2012 at 8:32 AM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> In my experience as a webdev, both behaviors have been requested for
> nav bars - all buttons equal size and all items equally spaced. I
> believe the desired behavior usually depends on whether the nav bar
> looks like a subdivided rectangle or a collection of discrete items.

You're right, I see both layouts for navbars.  For example, cnn.com uses
items equally spaced and apple.com uses items of equal size.  I suppose
sites that are going for a grid line layout will want items of equal size.

Ojan, Tony, when you say that 'flex-basis:0' is cheaper than 'auto',
> are you keeping in mind that, by default, flexbox items will have a
> min-width/height value of 'min-content'?  I don't know if we
> fast-track that for width, but it seems to require at least *some*
> layout-level computation.  For column flexboxes, the min-height seems
> to require a full layout anyway.

Huh, I totally missed section 4.4 about the implied min size.  I see it now
in the minutes sent on May 15th.

I understand the desire to avoid overflow, but it has the cost of making
layout slower by default, even if there's no overflow.  I'm not sure it's
worth it.  I would rather authors have to opt-in for slower behavior to
avoid overflow by setting min-width to min-content explicitly.  That seems
more consistent with how min-width works everywhere except for tables.
 Also, I think one of the reasons people don't use table layouts much
anymore is because of slow cases like this.

As a web author, if I'm trying to do a grid line layout using flexbox, I
think I would want to overflow rather than mess up the grid.  For example,
if I had a header align to a grid and I wanted the footer to align to the
same grid using a different flexbox, I would want to overflow.  Maybe this
is just an argument for using grid layout, but I think that's more
complicated and overkill for many sites.

> On Wed, May 23, 2012 at 1:48 AM, Anton Prowse <prowse@moonhenge.net>
> wrote:
> >> On the other hand, they merely *seem* indistinguishable for another
> >> common case, where each of the items has a short amount of text. On a
> >> large screen, they may seem approximately equal in both situations,
> >> but on a small screen, the "flex: auto" behavior is better, since it
> >> won't cause overflow on any of them until absolutely necessary.
> >
> > For navigation menus, the property you describe is very important, even
> > when the difference between the natural sizes of the items is not
> > enormous.

I'm OK with navigation menus having to add min-width: min-content to avoid
overflow (or using flex: auto).  Basically, you're opting into the slow
layout, but a navigation menu is simple and the slower layout is OK.

The benefit is when trying to use flexbox for site layout (like 3 column),
you get fast behavior by default.  Having to compute the min-content size
of the main body is going to be slow.
Received on Wednesday, 23 May 2012 18:05:06 UTC

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