- From: Andrew Fedoniouk <news@terrainformatica.com>
- Date: Mon, 09 Jun 2008 21:24:42 -0700
- To: robert@ocallahan.org
- CC: fantasai <fantasai.lists@inkedblade.net>, Anne van Kesteren <annevk@opera.com>, dbaron@dbaron.org, www-style@w3.org
Robert O'Callahan wrote: > On Tue, Jun 10, 2008 at 2:23 PM, Andrew Fedoniouk > <news@terrainformatica.com <mailto:news@terrainformatica.com>> wrote: > > Robert O'Callahan wrote: > > In this terms flex lengths and dimensions of position:absolute > and position:fixed elements can be computed against their layout > containers too. > > Thus: > div > { > position:absolute; > width:25%; > height:25%; > left:1*; top:1*; right:1*; bottom:1*; > } > > will position such an element in the middle of abs. pos. > container. > > > OK but how is this going to interact with the rules here, for > example: > http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width > > > I see no problems there either. > In most cases 'shrink-to-fit' is 1* exactly. > Practically in all cases 'auto' value can be replaced > by 1* value. > 1* is a mathematically correct way of saying 'auto' :) > > > That doesn't answer my question. You need to extend the rules in that > section to describe what happens when flexunits (not just "1*") appear > for margins, padding or content. For flow:vertical; box-sizing:content-box; ( default value ) vertical margins, paddings, content and borders in flex units share the same free space. So for style: div.inner { padding:1* 0; } This markup <div style="height:YYpx; flow:vertical"> <div class=inner>First</div> <div class=inner>Second</div> </div> will be rendered as |------------ | |First | | |Second | |------------ Rule is simple: free space is distributed among all lengths in the direction in the block that establishes box with free space. > > > > position:relative elements do not have concept of layout > container for computation of left,top,right and bottom > so flex values for these attributes are treated as undefined. > > > What does 'undefined' mean? 'auto'? > > > Here (for position:relative) it means 'auto' or just '0' (for > left,top,right and bottom) > > > OK. This is all stuff that needs to be added to your spec. > > Consider this: > > <div style="overflow:hidden; width:xx; height:yy"> > <img align=left id=first /> > <p flex=1>...</p> > <img align=left id=second /> > </div> > > You will have *exactly* the same kind of problems. > > > No. The flex on the <p> is ignored because the container is not a > flexbox. If the container was a flexbox, then the <img> elements would > not float. Exactly the same thing as with flex units. Just replace 'flexbox' by 'flow'. > > About flex paddings, consider task of vertical alignment of content > of some div. With flex units that is simple and naturally as: > > div > { > box-sizing: border-box; > height:1*; > border:1px solid; > padding:1* 10px; > } > > > I agree that flexunits are very powerful. > > > > You do have to account for how flexboxes behave in non-flexbox > containers, and how non-flexboxes behave in flexbox containers, > but this is considerably easier than reevaluating everything > that already exists. > > > I do not see any problems here too. > > > I was talking about flexboxes, not flexunits. The flexbox spec needs to > define, for example, what happens when you have a horizontal flexbox > containing a number of block children with flex --- how the horizontal > space allocated to each child is computed. (Your flexunits spec needs to > define that too.) > > Rob -- Andrew Fedoniouk. http://terrainformatica.com
Received on Tuesday, 10 June 2008 04:25:18 UTC