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

[css3-flexbox] resolving flexible lengths

From: Ojan Vafai <ojan@chromium.org>
Date: Thu, 29 Sep 2011 20:39:07 -0700
Message-ID: <CANMdWTu8=b+8ftPENPCfcNpGrL8DP8FKT-mXQyuYRocRJ3BGBg@mail.gmail.com>
To: www-style@w3.org
There are a couple issues with the
http://dev.w3.org/csswg/css3-flexbox/#resolving-flexible-lengths step.

1. It's not clear that the preferred size ignores min/max constraints. I
think the spec should explicitly state that it ignores min/max constraints
unless the preferred size is set to auto, in which case it takes them into

The use-case this allows is the following:
<div style="display: flexbox; width: 200px">
    <div style="width: flex(1); min-width: 100px;"></div>
    <div style="width: flex(3);"></div>

Clearly you would expect the first flex item to be 100px wide and the second
to be 300px. If the preferred width took min-width into account you would
instead get 125px and 75px.

2. It should be a requirement that flex items with a positive flex fill the
flexbox if possible given min/max constraints. Specifically, the currently
specced algorithm does the wrong thing in this case:

<div style="display: flexbox; width: 200px">
    <div style="width: flex(1 0 50px); min-width: 100px;"></div>
    <div style="width: flex(1 0 100px); max-width: 50px;"></div>

The first flex-item should have a width of 150, but instead it currently
gets a width of 100. Talking to Tab offline he suggested the following
"Looks like the fix is to separate them into different steps, with either
one having the ability to restart the algorithm.  If there is
positive free space, resolve max first; if there is negative free space,
resolve min first."

Seems fine to me.

3. Finally, it's not clear to me whether this algorithm is stable.
Specifically, I believe it matters what order you iterate through the flex
items. If it does, then the spec should clearly state the order it uses. The
options I see are layout order and document order. I think the former is
probably more intuitive, although I believe layout order would need to take
direction (and writing-mode?) into account in addition to flex-flow and

Received on Friday, 30 September 2011 03:40:00 UTC

This archive was generated by hypermail 2.3.1 : Wednesday, 11 February 2015 12:34:57 UTC