Repository navigation
[css-grid][css-multicol][css-flexbox][css-tables] Proposal for Various Gap Issues #1696
Description
We've had some feedback on gaps, the one prompting this discussion being that authors are finding it awkward that the grid shorthand resets the gaps, preferring that it does not and that it is treated similar to spacing controls such as grid container padding and grid item margins. (#1036)
Unwinding the threads of discussions and resolutions, and discussing with several people at the F2F here, we have the following proposal:
- Disconnect the
grid-gapproperties from thegridshorthand, resolving [css-grid] Setting of gutter properties when using the 'grid' shorthand #1036 - Undo the resolution changing
column-gapandrow-gaptogrid-column-gapandgrid-row-gap.- As before that resolution,
column-gapis shared with multi-col andnormalcomputes to zero except on multi-column elements.
- As before that resolution,
- Apply
column-gapandrow-gapto flex containers, resolving a strong demand from flexbox users to have this spacing control. (See Rachel's message to www-style and [css-flexbox] Make it easier to define margins that only apply between flex-items #592 with special note of erikjung's comment) - As a clean-up measure, have these properties obsolete
border-spacing(which inherits, which is weird) by having them defer toborder-spacingwhen specified asnormaland override it otherwise.
Activity
fantasai commentedon Aug 4, 2017
Note: We would need to (at least temporarily, possibly permanently) maintain aliases from
grid-*-gapto the unprefixed properties like we do forpage-break-*, since grid layouts are deployed already.bdc-stripe commentedon Aug 4, 2017
I'm very sympathetic to that idea. Nitpick: does that mean we'd only have a shorthand gap property for grid (assuming we keep the aliases) ?
rachelandrew commentedon Aug 4, 2017
I'd be happy with that as long as we have the aliasing and I think authors would be very keen with getting these for flex.
atanassov commentedon Aug 4, 2017
@bdc-stripe, no, the gap shorthand should work for any layout that accepts gaps
bdc-stripe commentedon Aug 4, 2017
@atanassov Ok cool (didn't see a proposal for
gap).SelenIT commentedon Aug 4, 2017
@fantasai, does #1036 (comment) mean that the last bullet point regarding tables has just been rejected?
tabatkins commentedon Aug 4, 2017
Yes, at least for now (and probably permanently), we're not going to apply row-gap and column-gap to tables.
fantasai commentedon Aug 9, 2017
WG resolution: https://logs.csswg.org/irc.w3.org/css/2017-08-04/#e847329
Proposal has been accepted, minus the tables part because nobody wants to deal with tables.
fantasai commentedon Aug 11, 2017
Edits checked in, closing issue. :) Expect to republish to /TR at the end of the month.
yisibl commentedon Nov 17, 2017
Please start the Flexbox 2 spec as soon as possible.
[css-grid] Unprefix gutter properties
[css-grid] Unprefix gutter properties
[css-grid] Unprefix gutter properties
[css-grid] Rename gutter properties to remove "grid-" prefix
Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…
Merge r228095 - [css-grid] Rename gutter properties to remove "grid-"…
zxti commentedon Apr 26, 2019
Hello from 2019! Is there a rough ETA for
gapin flexbox?rachelandrew commentedon Apr 26, 2019
@zxti gap has been specified for Flexbox. It is part of the Box Alignment specification. https://www.w3.org/TR/css-align-3/#gaps
If you are referring to browser implementation then Firefox has already implemented this. Other browsers have not as yet, but this isn't the place to chase that. The bug for Chrome is for example here https://bugs.chromium.org/p/chromium/issues/detail?id=762679
Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…
Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…
Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…
Merge r228095 - [css-grid] Rename gutter properties to remove "grid-"…
Bug 1441488 [wpt PR 9227] - [css-grid] Unprefix gutter properties, a=…