[css-grid] Add row-gap/column-gap (gutters) per WG resolution <https://lists.w3.org/Archives/Public/www-style/2013Dec/0121.html>

Author: fantasai

css-grid/Overview.bs

@@ -2827,7 +2827,7 @@ With a Grid Container as Parent</h3>
 -->
 
 <h2 id='alignment'>
-Alignment</h2>
+Alignment and Spacing</h2>
 
 	After a <a>grid container</a>’s <a>grid tracks</a> have been sized,
 	and the dimensions of all <a>grid items</a> are finalized,
@@ -2845,6 +2845,43 @@ Alignment</h2>
 	or margins are <a value for="margin">auto</a>,
 	<a>grid items</a> will auto-size to fit their contents.
 
+<h3 id='gutters'>
+Gutters: the 'column-gap' and 'row-gap' properties</h3>
+
+	<pre class='propdef'>
+	Name: row-gap, column-gap
+	Value: normal | <<length>>
+	Initial: normal
+	Applies to: <a>grid containers</a>
+	Inherited: no
+	Percentages: n/a
+	Media: visual
+	Computed value: specified value
+	</pre>
+
+	These properties specify the <dfn lt=gutter>gutters</dfn> between
+	<a>grid rows</a> and <a>grid columns</a>, respectively.
+	The effect is as though the affected <a>grid lines</a> acquired width:
+	the <a>grid track</a> between two <a>grid lines</a>
+	is the space between the <i>gutters</i> that represent them.
+	For the purpose of <a href="#algo-track-sizing">track sizing</a>,
+	each <i>gutter</i> is essentially treated as an extra track of the specified length.
+
+	Note: Additional spacing may be added between tracks
+	due to 'justify-content'/'align-content'.
+	See [[#algo-overview]].
+	This space effectively increases the size of the <i>gutters</i>.
+
+	Issue: We'd like to have a shorthand for this. Naming suggestions? (“grid-gap” is my best proposal so far)
+	'border-spacing' was proposed before, but we can't use it because it inherits :(
+
+	Issue: Should the 'grid' shorthand reset these properties? (I think that'd be a good idea.)
+
+	On <a>grid containers</a>, a value of <dfn for="row-gap,column-gap" dfn-type=value>normal</dfn> computes to zero.
+
+	Issue: It would be nice if we didn't have ''row-gap/normal'', but it exists for multi-column elements.
+	So we have it here, set to zero. It computes to zero so that getComputedStyle is straightforward to work with.
+	We could theoretically make it compute (to ''1em'') on multi-columns, too.
 
 <h3 id='auto-margins'>
 Aligning with <a value for="margin">auto</a> margins</h3>