W3C home > Mailing lists > Public > www-style@w3.org > November 2010

a new proposal for grid layout, derived from MSFT's

From: Daniel Glazman <daniel.glazman@disruptive-innovations.com>
Date: Wed, 17 Nov 2010 16:36:09 +0100
Message-ID: <4CE3F669.9040707@disruptive-innovations.com>
To: "www-style@w3.org" <www-style@w3.org>
CC: Alex Mogilevsky <alexmog@microsoft.com>, Markus Mielke <mmielke@microsoft.com>
I took an action item during TPAC to think a bit more about
grid layout. One of the requirements expressed during TPAC
was the ability to name the lines of the grid so removing/adding
lines does not imply extra work to change the indexes of lines
in the grid specification of elements.

So I think we need three properties to achieve that:

'grid-columns' is a comma-separated list of values being a length
       or a length followed by an ident naming the line
'grid-rows' same things here

A length accepts the 'fr' unit described in [1].

'grid-position' takes four idents representing the name of the
       top line, name of the right line, name of the bottom line,
       name of the left line

Line that are not named cannot referenced by the 'grid-position'
property.

Exemple VI in [1] would then be:

#grid { grid-columns: 0px firstVLine,
                       20px intermediateVLine1,
                       30px intermediateVLine2,
                       20px lastVLine;
         grid-rows:    0px firstHLine,
                       20px intermediateHLine1,
                       30px lastHLine;
       }
#A { grid-position: firstHLine
                     intermediateVLine1
                     intermediateHLine1
                     firstVLine; }
#B { grid-position: firstHLine
                     intermediateVLine2
                     intermediateHLine1
                     intermediateVLine1; }
#C { grid-position: firstHLine
                     lastVLine
                     lastHLine
                     intermediateVLine2; }
#D { grid-position: intermediateHLine1
                     intermediateVLine2
                     lastHLine
                     firstVLine; }

That preserves the original spirit of Microsoft's proposal
AND offers a clean solution to the issue raised by Peter Linss.

[1] http://www.interoperabilitybridges.com/css3-grid-align/

</Daniel>
Received on Wednesday, 17 November 2010 15:36:44 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:34 GMT