Re: [css3-grid] New draft Grid Positioning

Hi, Bert,

----- Original Message ----- 
From: "Bert Bos" <>
To: "Www-style" <>
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:

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)

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):
And here is source of the document you see:
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.

[1] flow attribute:
[2] demo application:
      /bin/browse.exe and documents in /html_samples/flows/*.htm

Received on Tuesday, 18 September 2007 18:33:36 UTC