W3C home > Mailing lists > Public > www-style@w3.org > September 2007

Re: [css3-grid] New draft Grid Positioning

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Tue, 18 Sep 2007 11:33:11 -0700
Message-ID: <000a01c7fa22$5e5cf190$f502000a@internal.toppro.net>
To: "Bert Bos" <bert@w3.org>, "Www-style" <www-style@w3.org>

Hi, Bert,

----- Original Message ----- 
From: "Bert Bos" <bert@w3.org>
To: "Www-style" <www-style@w3.org>
Sent: Tuesday, September 18, 2007 9:50 AM
Subject: Re: [css3-grid] New draft Grid Positioning


> 
> I haven't seen any comments yet, so maybe people need a reminder :-)
> 
> I wrote about about two weeks ago that a new draft, the Grid Module, 
> would be published shortly. And so it was, although not before the 
> weekend, as I hoped, but after it.
> 
> The URL I gave is now live, and so is this one:
> http://www.w3.org/TR/2007/WD-css3-grid-20070905
> 

To model this I've implemented my own version of your 
nice grid idea. I am explaining it here because I think it solves
some problems of  your proposal. And yet it is more simple
so have a chance to be implemented uniformely.

So here it is ----------------

Any element with display-model block-inside may 
have attribute flow[1] declared as flow:grid. 

Any contained blocks of such container can be positioned 
in cells of the grid by using left/top/right/bottom  CSS attributes
with use of special grid position units ( '#' - 'gr' in your proposal)

So: 
left: X#; top: Y#;  define left/top cell where block starts and
right: XX#; bottom: YY#; define right/bottom cell where block ends.

width/height attributes of contained blocks used for computation
of dimensions of rows and columns. In my case width/height
can accept flex units so they make grid layout even more flexible
- it can stretch on all available space vertically and horizontally. 

Here is an example:
Screenshot (shows the same document in different view sizes):  
http://www.terrainformatica.com/w3/flow-grid.png
And here is source of the document you see:
http://www.terrainformatica.com/w3/flow-grid.htm
You can see this alive by downloading demo application[3].

Final grid dimensions determined as min/max values of 
left/top/right/bottom value of contained elements.
If some contained element has no left/top/right/bottom
defined in grid position units then it is considered as having
  left:1#; right: last-column#;
  top:current-row#; bottom: current-row#;
- spans single row of the grid. 

----------------
The schema above is pretty simple (took 1 day to implement), 
not using any additional attributes (other than the 'flow') and does 
not require grid layout to be declared upfront as in your case. 

Andrew Fedoniouk.
http://terrainformatica.com

[1] flow attribute: 
      http://www.terrainformatica.com/htmlayout/flow.whtm
[2] demo application:
      http://www.terrainformatica.com/htmlayout/HTMLayoutDemo.zip
      /bin/browse.exe and documents in /html_samples/flows/*.htm
Received on Tuesday, 18 September 2007 18:33:36 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:52 GMT