From: Andrew Fedoniouk <news@terrainformatica.com>

Date: Fri, 28 May 2010 20:34:07 -0700

Message-ID: <3C1D1F1AD6AF48678431DD42E5DD500D@terra3>

To: <www-style@w3.org>

Date: Fri, 28 May 2010 20:34:07 -0700

Message-ID: <3C1D1F1AD6AF48678431DD42E5DD500D@terra3>

To: <www-style@w3.org>

It seems that I am the only person so far who have implemented flex units as a complete system. I mean I have infrastructure already in place to try the calc() in real environment. So here are practical questions. 1) Meaning of "free space". I am assuming that free space gets computed as: container-inner-space - sum-of-min-widths-of-children. So if sum-of-min-widths-of-children is greater than container-inner-space then 1.a) there is no free space, free space is zero; 1.b) there is a free space but it is negative, if "yes" then it is not a free space strictly speaking. Good name for it anyone? Anyway, which one of 1.a) and 1.b) is true? 2) Meaning of calc(flex + fixed) Let's imagine that we have container with inner width = 1000px that has single empty child A so it has no intrinsic min/max-widths. ----------------------------------------------------------------- If that A element is defined as A { width: calc(100px + 1fx); } I assume that min-widths-of-children in this case is: 2.a) min-width = 100px, free-space = 900px. So its computed width is just 1000px ? So that definition above is exactly (A - single child) A { width: 1fx; min-width: 100px; } Yes/no? ----------------------------------------------------------------- If A element is defined as A { width: calc(1100px + 1fx); } 2.b) min-width = 1100px, free-space = -100px so element will not overflow as total width = 1000px; 2.c) min-width = 1100px, free-space = 0px and element will overflow; If 2.c is true then it means that free-space as a value cannot be negative. ----------------------------------------------------------------- Now let's add min-width constraints in our equations A { width: calc(100px + 1fx); min-width: 900px; } 2.d) min-width = 900px, free-space = 100px and width = 900px. 2.e) min-width = 900px + 100px, free-space = 0px and width = 1000px. ----------------------------------------------------------------- Here is over constrained case A { width: calc(100px + 1fx); min-width: 1100px; } 2.f) min-width = 1100px, free-space =0px and width = 1100px, 2.g) min-width = 1100px, free-space = -100px and width = 1000px. If 2.g then it means that element dimensions can be less than its min constraints. If 2.f then it means, again, free-space cannot be negative. ----------------------------------------------------------------- Here is one more, but with max-width constrain A { width: calc(300px + 1fx); max-width: 200px; } What is the value of free space for the need of flex calculations? 2.h) 1000px - 300px = 700px? 2.i) 1000px - 200px = 800px? ----------------------------------------------------------------- Consider these two elements in the same 1000px container: A { width: calc(700px + 1fx); } B { width: calc(500px + 1fx); } what would be their computed widths? I assume that: 2.j) 700px and 500px so again free space is non-negative. of the are 2.k) 583px and 417px and so we are getting XUL's additive logic here? ----------------------------------------------------------------- So if to assume that free space is always non-negative that leads us to the constatation of the following: any expression with flex units can only increase minimal value and never decrease. So constructions like calc( 20px - 1fx) shall be prohibited. Sigh. I think that I am ready to start using 'calc(-1fx)' as an emoticon that means "can of worms". -- Andrew Fedoniouk http://terrainformatica.com -- Andrew Fedoniouk Terra Informatica Software, Inc.Received on Saturday, 29 May 2010 03:34:40 UTC

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