W3C home > Mailing lists > Public > www-style@w3.org > December 2015

Re: [css-grid] grid shorthand property doesn't specify gutter properties

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Tue, 22 Dec 2015 09:18:43 -0800
Message-ID: <CAAWBYDARwBa2B+Y1ZTbgZpBysN3usDF4j4z-grUaz9pMbEUDWw@mail.gmail.com>
To: Luke Stebbing <luke@lukestebbing.com>
Cc: www-style list <www-style@w3.org>
On Sat, Dec 19, 2015 at 7:59 AM, Luke Stebbing <luke@lukestebbing.com> wrote:
> According to the spec, grid-column-gap and grid-row-gap can be set by the
> grid shorthand property:
>> The grid property is a shorthand that sets all of the explicit grid
>> properties (grid-template-rows,grid-template-columns, and
>> grid-template-areas), all the implicit grid properties (grid-auto-rows,
>> grid-auto-columns, and grid-auto-flow), and the gutter properties
>> (grid-column-gap and grid-row-gap) in a single declaration.
> However, the gutter properties don't appear in the Value line:
>> Value: <‘grid-template’> | [ <‘grid-auto-flow’> [ <‘grid-auto-rows’> [ /
>> <‘grid-auto-columns’> ]? ]? ]
> I'm specifically wondering whether something like:
> grid: 4px
> is equivalent to:
> grid-column-gap: 4px
> grid-row-gap: 4px

It is not - "grid: 4px" is actually invalid (it doesn't match any of
the grammar branches in 'grid').

The 'grid' shorthand *sets* the gutter properties, but doesn't allow
you to specify them - they just reset to their initial (0) value.
This happens in a few other cases in CSS, where a shorthand is already
too complex to reasonably add a new subproperty, but the subproperty
should be set alongside all the others; the author would generally
expect 'grid' to set all the grid-specifying properties, and would be
surprised if an older 'grid-row-gap' still applied.

This means that if you want to set everything, you need to specify
'grid', and then 'grid-gap' after it.

(It's *almost* possible to unambiguously add the gap properties to the
shorthand, but not quite - if you placed the gap values after the
<'grid-template'> stuff, it's ambiguous where the column-list ends and
the gaps begin.  But even if it was unambiguous, it would be overly
complicated and we'd probably still act the same as we do now.)

Received on Tuesday, 22 December 2015 17:19:30 UTC

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