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

Re: Additive vs absolute flexes

From: Robert O'Callahan <robert@ocallahan.org>
Date: Wed, 19 May 2010 17:29:14 +1200
Message-ID: <AANLkTims-dizL4TPrjobtIvfXSXBCL0K6UESvVR4y2K0@mail.gmail.com>
To: Andrew Fedoniouk <news@terrainformatica.com>
Cc: www-style <www-style@w3.org>, sylvain.spinelli@kelis.fr
On Wed, May 19, 2010 at 3:27 PM, Andrew Fedoniouk <news@terrainformatica.com
> wrote:

> 1) To get "approximately 5 times" on this particular setup you should have
> height of the view equal to 6500px with (10% error).
> And if that "approximately" means 5% error then 13000px. I don't think this
> "approximately" makes any sense -
> it rather appears as a hack. If you would use absolute flex units then you
> will be able to make mental model of your
> layout. With additive flexes it is very hard to predict what you will get
> and why.
> Practically it is enough to define:
>   content-slot { height:4*; }
>   bottom-slot { height:2.5*; }
> and it will work with the same effect on practical view sizes.

Sylvain didn't think so.

If such nonlinear setup is really needed then you can combine plain old
> percents with flexes to get
> nearly the same effect.

Please describe how that would work.

Screenshots that you provided are more complex than what you have defined
> above.
> They contain non-flexible sections. If you will try to define that sections
> and left flexes only
> for the editor widget and list view widget then it will be completely
> different picture.
> And again there is horizontal splitter there - I doubt it will always
> follow your additive flex model.

The splitter and the left and right sections aren't relevant.

Further comments:
>> There is something I don't understand. In xul, if you don't set an
>> explicit width, the intrinsic content width is used instead. Setting a width
>> is only an override of the " intrinsic content width". In the W3C
>> simplification idea "just size each child proportionally to its flex value",
>> intrinsic content width will not be take in account at all ? In this case I
>> think we can find many other problematic use cases :
>>    - in classic dialog box, set flex=1 on 3 buttons in a hbox become
>>    unusable (long labels will be cut prematurely),
>>    - in a tree or listbox columns width will not be auto-adapted
>>    correctly (If I remember well, it was one of the big limit I found in extJs
>>    ui...),
>>    - etc.
>> I followed up to clarify these comments, especially the first one. This
> use-case is a horizontal box containing three labeled buttons with different
> length labels. When the box is as wide as the sum of the lengths of the
> labels, he wants each button to be the width of its label. When it gets
> wider than the ideal width, I think he wants each button to get an equal
> share of the extra space. When it gets narrower than the ideal width, he
> wants each button to lose an equal amount of space. He does not want one or
> more buttons disappearing beyond the edge of the box.
> Ha! If you have no ability to define paddings in flexes then sure you will
> need workarounds with additive model.
> With flex units you can write just this:
> button.greedy { padding-left:*; padding-right:*; margin:4px;  }

Good point.

There are other more complicated cases that it doesn't work with. For
example, if the buttons contained an icon and text, you might want extra
space to appear between the icon and the text. But I just made that up so
maybe it's not realistic. We need more use cases.

"He was pierced for our transgressions, he was crushed for our iniquities;
the punishment that brought us peace was upon him, and by his wounds we are
healed. We all, like sheep, have gone astray, each of us has turned to his
own way; and the LORD has laid on him the iniquity of us all." [Isaiah
Received on Wednesday, 19 May 2010 05:29:47 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:46 UTC