W3C home > Mailing lists > Public > www-style@w3.org > March 2012

Re: [css3-grid-layout] [css3-layout] default layout of children

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Fri, 2 Mar 2012 09:32:30 -0800
Message-ID: <CALRQH7-iYT8Mod1FL4GDp87WvX4TJGW2Wnv_tvwFtkr9-19ztg@mail.gmail.com>
To: Bert Bos <bert@w3.org>
Cc: www-style@w3.org
On Thu, Mar 1, 2012 at 3:25 PM, Bert Bos <bert@w3.org> wrote:
> On Sunday 26 February 2012 06:22:11 Andrew Fedoniouk wrote:
>> Just for the note:
>> I have flow:row() feature here:
>> http://www.terrainformatica.com/w3/flex-layout/flex-layout.htm#flow-r
>> ow
>> For example when I define template for the row as:
>> dl { flow:row(dt,dd); }
>> dt and dd elements in a <dl> list will be replaced in
>> two columns grid - dt in first column, dd in second.
>> All elements inside the container that do not
>> satisfy the template will take separate rows
>> spanning all columns. That is simple and
>> reliable I think.
> I think the main problem is where the content of the grid element itself
> goes. You cannot set a property on it, because we don't have selectors
> that select the content (as opposed to the whole element).
> If we have an answer to that, I think it will also be clear where child
> elements go.
> I actually think that the current answer isn't bad at all: you define a
> default slot at the same time as you declare the grid. Not with a
> separate property, but simply as part of the value of the 'grid'
> property. Less verbose, and less risk of mistakes.
> ...

I think that the main difference between Grid/Template layouts
and model that I use in flow: is in the concept of these slots.

I use "cell" model with exactly the same meaning as in <table>'s.
The "cell" model is implicitly used by flex-box too.

You and Grid guys use concept of "slots".

Slot model:
You define grid of slots - rectangular virtual containers.
Each such a container may contain arbitrary number of DOM elements

Cell model:
DOM element is a cell. There is no grid of rules/guidelines of any sort.
Dimensions of cells define dimensions of rows and columns.
Exactly in the same way as in tables now.

Cell model is purely position:static layout. Content sizes of
children define size constraints and final size of the container
itself.  Content of the cell element declared as overflow:visible will
never overflow (as in tables).

Slot model is a variation of position:absolute replacement.
DOM elements placed in the slot may overflow dimensions of
that slot. For the element placed in a slot it is not clear
what things like width:100% mean? Will it be set to
width of slot or to the width of grid?
Actually here is more interesting question:
In grid/template, how to say "I want this element to span
whole slot"? So its border box will be equal to slot box.

Andrew Fedoniouk.

Received on Friday, 2 March 2012 17:33:02 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:13 UTC