[css-grid-2] Switch aspect-ratio-controlled gaps to use ar unit instead of <<number>> per WG resolution. #1116

Author: fantasai

css-grid-2/Overview.bs

@@ -484,39 +484,41 @@ Subgrid Sizing Algorithm</h3>
 Aspect-ratio&ndash;controlled Gutters</h2>
 
 	Issue: There's a desire for having row and column gaps maintain a particular aspect ratio.
-	This is one proposal for doing so; other ideas are welcome.<br>
-	Possible extension: allow aspect ratio multipliers on 'row-gap' and 'column-gap' as well (not really useful except if you're using percents).<br>
-	Possible variation: use an `ar` unit instead of bare <<number>>s.<br>
+	This is one proposal for doing so; other ideas are welcome.
 	See discussion in <a href="https://github.com/w3c/csswg-drafts/issues/1116">Issue 1116</a>.
+	Note this feature is likely to move to css-align-4,
+	it is just being drafted up here while css-align-3 stabilizes.
 
 	<pre class="propdef">
 	Name: align-content, justify-content
-	New values: [ <<number>> && <<content-distribution>>? ]
+	New values: [ <<aspect-ratio>> <<content-distribution>>? ]
 	</pre>
 
+
 	<dl dfn-for="align-content,justify-content" dfn-type=value>
-		<dt><dfn><<number>></dfn>
+		<dt><dfn>&lt;aspect-ratio></dfn>
 		<dd>
-			Represents a multiplier against the analogous quantity
+			A <a spec="css-values">dimension</a> with the unit ''ar'',
+			representing a multiplier against the analogous quantity
 			in the other dimension.
 			If that quantity cannot be determined
-			(e.g. is itself specified as a <<number>>, or otherwise can't be referenced),
+			(e.g. is itself specified as a <<aspect-ratio>>, or otherwise can't be referenced),
 			then it is assumed to be zero.
 
 			Note: This value can expand gutters
 			even when there is no free space left,
 			causing overflow.
 
-			Specifically, an 'align-content' value of ''1'' represents
+			Specifically, an 'align-content' value of ''1ar'' represents
 			the amount of space (which may be zero) allocated between two adjacent
-			<a>alignment subjects</a> (<a>grid tracks</a> / <a>flex lines</a> / <a>column boxes</a>)
+			<a>alignment subjects</a> (<a>grid tracks</a> / <a>flex lines</a> / <a spec="css-multicol">column boxes</a>)
 			by the 'justify-content' property.
 			Unless a different <<content-distribution>> value is specified,
 			space is distributed according to the same <<content-distribution>> rules
 			as for 'justify-content'.
 			The behavior of <<number>> values for 'justify-content' is analogous.
 
-			Note: The space allocated by ''align-content: 1'' will be zero
+			Note: The space allocated by ''align-content: 1ar'' will be zero
 			if 'justify-content' does not allocate space
 			between adjacent <a>alignment subjects</a>:
 			either due to not having a <<content-distribution>> value
@@ -546,7 +548,7 @@ Aspect-ratio&ndash;controlled Gutters</h2>
 				grid-template-columns: repeat(auto-fill, 15em);
 				gap: 1em;
 				justify-content: space-evenly;
-				align-content: 1.0 space-between;
+				align-content: 1ar space-between;
 			}
 		</pre>
 
@@ -558,7 +560,7 @@ Aspect-ratio&ndash;controlled Gutters</h2>
 				grid-template-columns: repeat(auto-fill, 15em);
 				gap: 1em 1.618em;
 				justify-content: space-evenly;
-				align-content: 0.618 space-between;
+				align-content: 0.618ar space-between;
 			}
 		</pre>
 	</div>