[css-grid] Removed the sections about collapsing and gutters. The text has been moved to the wiki.

Author: tabatkins

css-grid/Overview.html

@@ -106,8 +106,7 @@ <h2 class="no-num no-toc no-ref" id=contents><span class=content>Table of conten
 Grid Layout Box Model</a><ul class=toc><li><a href=#grid-containers><span class=secno>3.1</span>
 Grid Containers: the <span data-link-type=value>grid</span> and <span class=css data-link-type=maybe>inline-grid</span> <span class=property data-link-type=propdesc title=display>display</span> values</a></ul><li><a href=#grid-items><span class=secno>4</span>
 Grid Items</a><ul class=toc><li><a href=#abspos-items><span class=secno>4.1</span>
-Absolutely-positioned Grid Children</a><li><a href=#visibility-collapse><span class=secno>4.2</span>
-Collapsed Grid Items: the <span class=property data-link-type=propdesc title=visibility>visibility</span> property</a><li><a href=#order-property><span class=secno>4.3</span>
+Absolutely-positioned Grid Children</a><li><a href=#order-property><span class=secno>4.2</span>
 Reordered Grid Items: the <span class=property data-link-type=propdesc title=order>order</span> property</a></ul><li><a href=#grid-definition><span class=secno>5</span>
 The Explicit Grid</a><ul class=toc><li><a href=#track-sizing><span class=secno>5.1</span>
 Track Sizing: the <span class=property data-link-type=propdesc title=grid-template-rows>grid-template-rows</span> and <span class=property data-link-type=propdesc title=grid-template-columns>grid-template-columns</span> properties</a><ul class=toc><li><a href=#named-lines><span class=secno>5.1.1</span>
@@ -127,18 +126,17 @@ <h2 class="no-num no-toc no-ref" id=contents><span class=content>Table of conten
 Implicit Grid Shorthand: the <span class=property data-link-type=propdesc title=grid-auto>grid-auto</span> property</a></ul><li><a href=#placement><span class=secno>7</span>
 Placing Grid Items</a><ul class=toc><li><a href=#line-placement><span class=secno>7.1</span>
 Line-based Placement: the <span class=property data-link-type=propdesc title=grid-row-start>grid-row-start</span>, <span class=property data-link-type=propdesc title=grid-column-start>grid-column-start</span>, <span class=property data-link-type=propdesc title=grid-row-end>grid-row-end</span>, and <span class=property data-link-type=propdesc title=grid-column-end>grid-column-end</span> properties</a><li><a href=#placement-shorthands><span class=secno>7.2</span>
-Placement Shorthands: the <span class=property data-link-type=propdesc title=grid-column>grid-column</span>, <span class=property data-link-type=propdesc title=grid-row>grid-row</span>, and <span class=property data-link-type=propdesc title=grid-area>grid-area</span> properties</a></ul><li><a href=#gutters><span class=secno>8</span>
-Gutters</a><li><a href=#alignment><span class=secno>9</span>
-Alignment</a><ul class=toc><li><a href=#auto-margins><span class=secno>9.1</span>
-Aligning with <span data-link-for=margin data-link-type=value>auto</span> margins</a><li><a href=#row-align><span class=secno>9.2</span>
-Row-axis Alignment: the <span class=property data-link-type=propdesc title=justify-self>justify-self</span> and <span class=property data-link-type=propdesc title=justify-items>justify-items</span> properties</a><li><a href=#column-align><span class=secno>9.3</span>
-Column-axis Alignment: the <span class=property data-link-type=propdesc title=align-self>align-self</span> and <span class=property data-link-type=propdesc title=align-items>align-items</span> properties</a><li><a href=#z-order><span class=secno>9.4</span>
-Z-axis Ordering: the <span class=property data-link-type=propdesc title=z-index>z-index</span> property</a><li><a href=#grid-baselines><span class=secno>9.5</span>
-Grid Baselines</a></ul><li><a href=#layout-algorithm><span class=secno>10</span>
-Grid Layout Algorithm</a><ul class=toc><li><a href=#algo-terms><span class=secno>10.1</span>
-Definition of Terms for use in Calculating Grid Track Sizes</a><li><a href=#grid-track-sizing-algorithm><span class=secno>10.2</span>
-Grid Track Sizing Algorithm</a><li><a href=#shrink-to-fit><span class=secno>10.3</span>
-Defining the Shrink-to-fit Behavior of Grid Elements</a></ul><li><a href=#pagination><span class=secno>11</span>
+Placement Shorthands: the <span class=property data-link-type=propdesc title=grid-column>grid-column</span>, <span class=property data-link-type=propdesc title=grid-row>grid-row</span>, and <span class=property data-link-type=propdesc title=grid-area>grid-area</span> properties</a></ul><li><a href=#alignment><span class=secno>8</span>
+Alignment</a><ul class=toc><li><a href=#auto-margins><span class=secno>8.1</span>
+Aligning with <span data-link-for=margin data-link-type=value>auto</span> margins</a><li><a href=#row-align><span class=secno>8.2</span>
+Row-axis Alignment: the <span class=property data-link-type=propdesc title=justify-self>justify-self</span> and <span class=property data-link-type=propdesc title=justify-items>justify-items</span> properties</a><li><a href=#column-align><span class=secno>8.3</span>
+Column-axis Alignment: the <span class=property data-link-type=propdesc title=align-self>align-self</span> and <span class=property data-link-type=propdesc title=align-items>align-items</span> properties</a><li><a href=#z-order><span class=secno>8.4</span>
+Z-axis Ordering: the <span class=property data-link-type=propdesc title=z-index>z-index</span> property</a><li><a href=#grid-baselines><span class=secno>8.5</span>
+Grid Baselines</a></ul><li><a href=#layout-algorithm><span class=secno>9</span>
+Grid Layout Algorithm</a><ul class=toc><li><a href=#algo-terms><span class=secno>9.1</span>
+Definition of Terms for use in Calculating Grid Track Sizes</a><li><a href=#grid-track-sizing-algorithm><span class=secno>9.2</span>
+Grid Track Sizing Algorithm</a><li><a href=#shrink-to-fit><span class=secno>9.3</span>
+Defining the Shrink-to-fit Behavior of Grid Elements</a></ul><li><a href=#pagination><span class=secno>10</span>
 Fragmenting Grid Layout</a><li><a href=#acknowledgements><span class=secno></span>
 Acknowledgements</a><li><a href=#changes><span class=secno></span>
 Changes</a><li><a href=#conformance><span class=secno></span>
@@ -783,21 +781,8 @@ <h3 data-level=4.1 id=abspos-items><span class=secno>4.1 </span><span class=cont
 		elements that are absolutely-positioned to a <a href=#grid-container>grid container</a>
 		do not take up space or otherwise participate in the layout of the grid.
 
-<h3 data-level=4.2 id=visibility-collapse><span class=secno>4.2 </span><span class=content>
-Collapsed Grid Items: the <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visufx.html#propdef-visibility title=visibility>visibility</a> property</span><a class=section-link href=#visibility-collapse>§</a></h3>
-<!--
-	<p>
-		Specifying <span data-link-type="maybe" class="css">visibility: collapse</span> on a <a>grid item</a> causes it to become a <dfn export title="collapsed grid item|collapsed">collapsed grid item</dfn>.
-		This has the same effect as <span data-link-type="maybe" class="css">visibility: hidden</span>,
-		except that if all the <a>grid items</a> spanning a track are <a>collapsed</a>,
-		the track's intrinsic size becomes zero.
--->
-	<p class=issue>
-		We want the ability to collapse grid tracks (similar to collapsing flex items or table rows/columns), but we're not sure exactly how to do it.
-		Ideas welcome, please post them to the list.
-
 
-<h3 data-level=4.3 id=order-property><span class=secno>4.3 </span><span class=content>
+<h3 data-level=4.2 id=order-property><span class=secno>4.2 </span><span class=content>
 Reordered Grid Items: the <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-flexbox-1/#order title=order>order</a> property</span><a class=section-link href=#order-property>§</a></h3>
 
 	<p>
@@ -1878,24 +1863,8 @@ <h3 data-level=7.2 id=placement-shorthands><span class=secno>7.2 </span><span cl
 		Should <a class=property data-link-type=propdesc href=#propdef-grid-area title=grid-area>grid-area</a> be <a class=property data-link-type=propdesc title=grid-field>grid-field</a>?
 
 
-<h2 data-level=8 id=gutters><span class=secno>8 </span><span class=content>
-Gutters</span><a class=section-link href=#gutters>§</a></h2>
-
-	<div class=issue>
-		We should have some way of defining "gutter" columns/rows,
-		where content can never go
-		(unless it's spanning across two tracks).
-		Otherwise, auto-flow is completely broken when you manually add gutters,
-		and it's just much less convenient to add them manually.
-
-<p>		<a href=http://lists.w3.org/Archives/Public/www-style/2013May/0057.html>Lea's email on the subject.</a>
-		See <a href=http://lists.w3.org/Archives/Public/www-style/2013May/0077.html>our proposal</a>
-		and <a href=http://lists.w3.org/Archives/Public/www-style/2012Mar/0611.html>Tab's email on the subject</a>.
-	</div>
-
-
 
-<h2 data-level=9 id=alignment><span class=secno>9 </span><span class=content>
+<h2 data-level=8 id=alignment><span class=secno>8 </span><span class=content>
 Alignment</span><a class=section-link href=#alignment>§</a></h2>
 
 	<p>
@@ -1918,7 +1887,7 @@ <h2 data-level=9 id=alignment><span class=secno>9 </span><span class=content>
 		<a href=#grid-item>grid items</a> will auto-size to fit their contents.
 
 
-<h3 data-level=9.1 id=auto-margins><span class=secno>9.1 </span><span class=content>
+<h3 data-level=8.1 id=auto-margins><span class=secno>8.1 </span><span class=content>
 Aligning with <a data-link-for=margin data-link-type=value>auto</a> margins</span><a class=section-link href=#auto-margins>§</a></h3>
 
 	<p>
@@ -1952,7 +1921,7 @@ <h3 data-level=9.1 id=auto-margins><span class=secno>9.1 </span><span class=cont
 	</div>
 
 
-<h3 data-level=9.2 id=row-align><span class=secno>9.2 </span><span class=content>
+<h3 data-level=8.2 id=row-align><span class=secno>8.2 </span><span class=content>
 Row-axis Alignment: the <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-align-3/#justify-self title=justify-self>justify-self</a> and <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-align-3/#justify-items title=justify-items>justify-items</a> properties</span><a class=section-link href=#row-align>§</a></h3>
 
 	<p>
@@ -1973,7 +1942,7 @@ <h3 data-level=9.2 id=row-align><span class=secno>9.2 </span><span class=content
 
 
 
-<h3 data-level=9.3 id=column-align><span class=secno>9.3 </span><span class=content>
+<h3 data-level=8.3 id=column-align><span class=secno>8.3 </span><span class=content>
 Column-axis Alignment: the <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-align-3/#align-self title=align-self>align-self</a> and <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-align-3/#align-items title=align-items>align-items</a> properties</span><a class=section-link href=#column-align>§</a></h3>
 
 	<p>
@@ -1983,7 +1952,7 @@ <h3 data-level=9.3 id=column-align><span class=secno>9.3 </span><span class=cont
 		or <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-align-3/#align-items title=align-items>align-items</a> property on the <a href=#grid-container>grid container</a>,
 		as defined in <a data-biblio-type=normative data-link-type=biblio href=#css3-align title=CSS3-ALIGN>[CSS3-ALIGN]</a>.
 
-<h3 data-level=9.4 id=z-order><span class=secno>9.4 </span><span class=content>
+<h3 data-level=8.4 id=z-order><span class=secno>8.4 </span><span class=content>
 Z-axis Ordering: the <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-position-3/#z-index title=z-index>z-index</a> property</span><a class=section-link href=#z-order>§</a></h3>
 
 
@@ -2038,7 +2007,7 @@ <h3 data-level=9.4 id=z-order><span class=secno>9.4 </span><span class=content>
   &lt;div id="E"&gt;E&lt;/div&gt;
 &lt;/div&gt;</pre>	</div>
 
-<h3 data-level=9.5 id=grid-baselines><span class=secno>9.5 </span><span class=content>
+<h3 data-level=8.5 id=grid-baselines><span class=secno>8.5 </span><span class=content>
 Grid Baselines</span><a class=section-link href=#grid-baselines>§</a></h3>
 
 	<p>
@@ -2087,10 +2056,10 @@ <h3 data-level=9.5 id=grid-baselines><span class=secno>9.5 </span><span class=co
 
 
 
-<h2 data-level=10 id=layout-algorithm><span class=secno>10 </span><span class=content>
+<h2 data-level=9 id=layout-algorithm><span class=secno>9 </span><span class=content>
 Grid Layout Algorithm</span><a class=section-link href=#layout-algorithm>§</a></h2>
 
-<h3 data-level=10.1 id=algo-terms><span class=secno>10.1 </span><span class=content>
+<h3 data-level=9.1 id=algo-terms><span class=secno>9.1 </span><span class=content>
 Definition of Terms for use in Calculating Grid Track Sizes</span><a class=section-link href=#algo-terms>§</a></h3>
 
 	<dl>
@@ -2116,7 +2085,7 @@ <h3 data-level=10.1 id=algo-terms><span class=secno>10.1 </span><span class=cont
 	</dl>
 
 
-<h3 data-level=10.2 id=grid-track-sizing-algorithm><span class=secno>10.2 </span><span class=content>
+<h3 data-level=9.2 id=grid-track-sizing-algorithm><span class=secno>9.2 </span><span class=content>
 Grid Track Sizing Algorithm</span><a class=section-link href=#grid-track-sizing-algorithm>§</a></h3>
 	<ol>
 		<li>Call ComputedUsedBreadthOfGridTracks for Grid Columns to resolve their logical width.
@@ -2563,14 +2532,14 @@ <h3 data-level=10.2 id=grid-track-sizing-algorithm><span class=secno>10.2 </span
 		</dl>
 	</dl>
 
-<h3 data-level=10.3 id=shrink-to-fit><span class=secno>10.3 </span><span class=content>
+<h3 data-level=9.3 id=shrink-to-fit><span class=secno>9.3 </span><span class=content>
 Defining the Shrink-to-fit Behavior of Grid Elements</span><a class=section-link href=#shrink-to-fit>§</a></h3>
 
 	<p>
 		The <a href=http://www.w3.org/TR/css3-box/#shrink-to-fit>CSS3 Box Model</a> defines the shrink-to-fit behavior of an element as min(max(preferred minimum width, available width), preferred width), with available width defined in the Box Model spec. Accordingly, for the <a href=#grid-container>grid container</a> we define the preferred minimum width as the sum of the UsedBreadths of the <a href=#grid-track>Grid tracks</a> just before step 3 in ComputeUsedBreadthOfGridTracks, and the preferred width as the sum of the UsedBreadths of the <a href=#grid-track>Grid tracks</a> after the entire track sizing algorithm has been run with infinite space.
 
 
-<h2 data-level=11 id=pagination><span class=secno>11 </span><span class=content>
+<h2 data-level=10 id=pagination><span class=secno>10 </span><span class=content>
 Fragmenting Grid Layout</span><a class=section-link href=#pagination>§</a></h2>
 
 	<p class=issue>
@@ -2743,7 +2712,7 @@ <h2 class="no-num no-ref" id=index><span class=content>
 <li>auto-placement cursor, <a href=#auto-placement-cursor title="section 6.2.1">6.2.1</a>
 <li>auto (value), <a href=#valuedef-auto title="section 5.1">5.1</a>
 <li>auto (value), <a href=#grid-placement-auto title="section 7.1">7.1</a>
-<li>AvailableSpace, <a href=#AvailableSpace-definition title="section 10.1">10.1</a>
+<li>AvailableSpace, <a href=#AvailableSpace-definition title="section 9.1">9.1</a>
 <li>column, <a href=#columns title="section 2">2</a>
 <li>column axis, <a href=#column-axis title="section 2">2</a>
 <li>columns (value), <a href=#valuedef-columns title="section 6.2">6.2</a>
@@ -2787,27 +2756,27 @@ <h2 class="no-num no-ref" id=index><span class=content>
 <li>&lt;line-name-list&gt;, <a href=#typedef-line-name-list title="section 5.1">5.1</a>
 <li>&lt;line-names&gt;, <a href=#typedef-line-names title="section 5.1">5.1</a>
 <li>max-content (value), <a href=#valuedef-max-content title="section 5.1">5.1</a>
-<li>MaxTrackSizingFunction, <a href=#MaxTrackSizingFunction-definition title="section 10.1">10.1</a>
+<li>MaxTrackSizingFunction, <a href=#MaxTrackSizingFunction-definition title="section 9.1">9.1</a>
 <li>min-content (value), <a href=#valuedef-min-content title="section 5.1">5.1</a>
 <li>minmax() (value), <a href=#valuedef-minmaxmin-max title="section 5.1">5.1</a>
-<li>MinTrackSizingFunction, <a href=#MinTrackSizingFunction-definition title="section 10.1">10.1</a>
+<li>MinTrackSizingFunction, <a href=#MinTrackSizingFunction-definition title="section 9.1">9.1</a>
 <li>named grid area, <a href=#named-grid-areas title="section 5.2">5.2</a>
 <li>named line, <a href=#named-lines0 title="section 5.1.1">5.1.1</a>
 <li>none (value), <a href=#valuedef-none0 title="section 5.1">5.1</a>
 <li>none (value), <a href=#valuedef-none1 title="section 5.2">5.2</a>
 <li>none (value), <a href=#valuedef-none2 title="section 5.3">5.3</a>
 <li>none (value), <a href=#valuedef-none title="section 6.2">6.2</a>
-<li>order-modified grid order, <a href=#order-modified-grid-order title="section 9.5">9.5</a>
-<li>participates in baseline alignment, <a href=#baseline-participation title="section 9.5">9.5</a>
+<li>order-modified grid order, <a href=#order-modified-grid-order title="section 8.5">8.5</a>
+<li>participates in baseline alignment, <a href=#baseline-participation title="section 8.5">8.5</a>
 <li>&lt;percentage&gt; (value), <a href=#valuedef-percentage title="section 5.1">5.1</a>
 <li>placement, <a href=#placement0 title="section 7.1">7.1</a>
-<li>RemainingSpace, <a href=#RemainingSpace-definition title="section 10.1">10.1</a>
+<li>RemainingSpace, <a href=#RemainingSpace-definition title="section 9.1">9.1</a>
 <li>repeat(), <a href=#funcdef-repeat title="section 5.1.2">5.1.2</a>
 <li>row, <a href=#rows title="section 2">2</a>
 <li>row axis, <a href=#row-axis title="section 2">2</a>
 <li>rows (value), <a href=#valuedef-rows title="section 6.2">6.2</a>
 <li>sizing function, <a href=#sizing-function title="section 5.1">5.1</a>
-<li>SpanCount, <a href=#SpanCount-definition title="section 10.1">10.1</a>
+<li>SpanCount, <a href=#SpanCount-definition title="section 9.1">9.1</a>
 <li>span &amp;&amp; [ &lt; || &lt;ident&gt; ] (value), <a href=#grid-placement-span-int title="section 7.1">7.1</a>
 <li>&lt;string&gt;+ (value), <a href=#valuedef-string title="section 5.2">5.2</a>
 <li>subgrid, <a href=#subgrid title="section 5.1.4">5.1.4</a>

css-grid/Overview.src.html

@@ -696,19 +696,6 @@ <h3 id="abspos-items">
 		elements that are absolutely-positioned to a <a>grid container</a>
 		do not take up space or otherwise participate in the layout of the grid.
 
-<h3 id="visibility-collapse">
-Collapsed Grid Items: the 'visibility' property</h3>
-<!--
-	<p>
-		Specifying ''visibility: collapse'' on a <a>grid item</a> causes it to become a <dfn export title="collapsed grid item|collapsed">collapsed grid item</dfn>.
-		This has the same effect as ''visibility: hidden'',
-		except that if all the <a>grid items</a> spanning a track are <a>collapsed</a>,
-		the track's intrinsic size becomes zero.
--->
-	<p class='issue'>
-		We want the ability to collapse grid tracks (similar to collapsing flex items or table rows/columns), but we're not sure exactly how to do it.
-		Ideas welcome, please post them to the list.
-
 
 <h3 id='order-property'>
 Reordered Grid Items: the 'order' property</h3>
@@ -1928,22 +1915,6 @@ <h3 id='placement-shorthands'>
 		Should 'grid-area' be 'grid-field'?
 
 
-<h2 id='gutters'>
-Gutters</h2>
-
-	<div class='issue'>
-		We should have some way of defining "gutter" columns/rows,
-		where content can never go
-		(unless it's spanning across two tracks).
-		Otherwise, auto-flow is completely broken when you manually add gutters,
-		and it's just much less convenient to add them manually.
-
-		<a href="http://lists.w3.org/Archives/Public/www-style/2013May/0057.html">Lea's email on the subject.</a>
-		See <a href="http://lists.w3.org/Archives/Public/www-style/2013May/0077.html">our proposal</a>
-		and <a href="http://lists.w3.org/Archives/Public/www-style/2012Mar/0611.html">Tab's email on the subject</a>.
-	</div>
-
-
 
 <h2 id='alignment'>
 Alignment</h2>