Re: [css3-flex] calc(flex) and concept of free space.

On Thu, Jun 3, 2010 at 9:33 AM, Brad Kemper <brad.kemper@gmail.com> wrote:
>
> On Jun 3, 2010, at 9:16 AM, Tab Atkins Jr. wrote:
>
>>> <div width:1000px padding-left:1fx
>>>        box-sizing:border-box *flow:vertical*>
>>>  <div #A width:calc(700px + 1fx) />
>>>  <div #B width:2fx />
>>> </div>
>>>
>>> What would be the width of div#A ?
>>> (#B there is just for illustration).
>>
>> It's 700px, by the exact same logic in the previous version of this
>> problem.  (#B is 0px wide.)
>>
>> It would be more useful if you could explain precisely which part of
>> my explanation wasn't useful.  There's something about this case that
>> you don't get, and my explanations aren't helping, so I'd like to know
>> why, just in case it's something I'm fundamentally missing.
>
> I don't think it makes any sense for the fx in the padding of the outer div to participate in the space distribution of the children. I do see where you have that in the draft [1], but it just seems unexpected, inconsistent, and likely to confuse. I would rather that it was only the space of the actual children that got divvied up (including the padding and margins of those children).
>
> I suppose this is done so that you can use flex on boxes whose only children are text nodes, but wouldn't it be just as easy to set the display of their parent to 'flex'?

Actually, it's so you can emulate box-pack start/end/center without
having to futz around with putting flex margins on only the first and
last child (or worse, on only the first and last child *per line*).
First, the flex on the parent's padding is evaluated (first
distribution round).  Second, the flex on the children is evaluated,
if there's any space left after the first round.  Finally we handle
any flexible lengths that weren't done in the two previous rounds
(this can only happen if you're using box-sizing on the children).

So box-pack start/end/center are just done by putting some padding on
the parent, which eats up all the free space available and shoves the
children around appropriately.


> 1. One very long URL: http://www.xanthir.com/document/document.php?id=615d486a4dd75e8f4ae644eaa02af778211809483881e4964e66c29d5618b7ae457190b450c9e53abee05aa2e590cefc8100663c8d91328a1bd786ab9f1e7f2b#section1.4.0

Haha, use www.xanthir.com/:wih instead.  ^_^

~TJ

Received on Thursday, 3 June 2010 17:00:39 UTC