W3C home > Mailing lists > Public > www-style@w3.org > August 2013

[css-grid] Summary of Changes

From: fantasai <fantasai.lists@inkedblade.net>
Date: Mon, 19 Aug 2013 14:44:43 -0700
Message-ID: <521291CB.5070507@inkedblade.net>
To: "www-style@w3.org" <www-style@w3.org>
Tab and I recently completed various edits we were responsible for making
after the Tokyo F2F and subsequent discussions. These changes are listed
below, along with a few extra things we modified...

1. Switch before/start/after/end to row/column-start/end

As resolved on 2013-05-08 as part of the Logical Directions Renaming,
we've updated the grid placement properties to be
   grid-column end
with the shorthands
See http://dev.w3.org/csswg/css-grid/#placement

2. Common prefix and shorthand for grid-defining properties

As discussed at the Tokyo F2F, we changed the grid-definition-* properties
to grid-template-*, changed grid-template to grid-template-areas, and
added grid-template as a shorthand using Bert's syntax from Template Layout.

   grid-definition-rows    -> grid-template-rows
   grid-definition-columns -> grid-template columns
   grid-template           -> grid-template-areas

   New shorthand:             grid-template

The only differences in the shorthand from Bert's syntax are the
addition of a syntax for named lines and the use of a slash after
the list of columns. (The slash was added to allow the shorthand
to be used to define columns and rows even if a template is not

These four properties are now grouped together under a section
titled "The Explicit Grid", since together they define the
"explicit grid" (as opposed to the auto-generated grid).

3. Grid Auto Flow

Per WG resolution, we added an optional 'dense' keyword to
the 'grid-auto-flow' property.
and as discussed at the Tokyo F2F, made 'rows' the default value,
dropping the initial 'none' (which piled all the grid items into
slot 1,1; not really ideal behavior)
We're leaving open the possibility of adding more values to the
'grid-auto-flow' property to allow some of the other behaviors;
these are marked as issues in the draft:

4. grid-auto shorthand

Since grid-auto-flow, grid-auto-rows, and grid-auto-columns all
have the same prefix, we also went ahead and created a 'grid-auto'
shorthand that sets all three in the same place. This is useful
particularly for grids that are entirely auto-flowed.

Hopefully everyone else also thinks this is sensible. :)

5. Absolutely Positioned Items

We went ahead and updated the issue on what an 'auto' offset
means to indicate the padding edge of the grid container,
as resolved at the Tokyo F2F:

There's still an open issue on what the static position should
be for absolutely-positioned children of a grid that are not
positioned into a grid slot.

6. Descendant Grid Items

Since there wasn't clear consensus on how to allow descendants
of a grid item to jump up and participate in the grid, we removed
this feature from the spec. See F2F discussion at

It might be useful to add such a feature in the future, but maybe
in a different level, once we have a better proposal for it.

Meanwhile, the "subgrid" proposal handles a lot of the use cases
for this feature, and handles them better.

7. Subgrid Feature

Tab and I had an action item from discussions with Rossen to work
out a more solid "subgrid" feature proposal. This is now done.
See thread at
for more discussion of the motivation behind subgrids.

8. Named Lines Syntax

The previous named lines syntax was pretty awkward, as pointed out
here: http://lists.w3.org/Archives/Public/www-style/2013Mar/0256.html
It also used strings as CSS-internal identifiers, which we don't do
anywhere else. Tab and I took the proposal from that thread, which
was to switch to identifiers and use parentheses to group multiple
names for the same position. This has the benefit of
   - Using identifiers, consistent with the rest of CSS
   - Providing visual grouping of names that identify the same location
   - Allowing the named grid areas template syntax (which uses strings)
     to co-exist with named lines in the grid-template shorthand.

We think this is a dramatic improvement over the previous syntax,
and hope that the rest of the WG agrees. :)

9. Implicit Named Lines

Peter Linss's "Alternative Grid Layout" proposal from last year
specified that a named grid area (template slot) implies the
creation of some named lines corresponding to each side of the
named slot.
We've added this feature as "Implicit Named Lines", here:

There was a second half to the proposal, where named lines following
that pattern created implicit named grid areas, but we have not
added that feature as it seemed somewhat complicated to define.
(It could create duplicate named areas, for example, which right
now are thrown out at parse time when specified via 'grid-template'.)

~fantasai and TJ
Received on Monday, 19 August 2013 21:45:12 UTC

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