[css-grid] bikeshed fix

Author: tabatkins

css-grid/Overview.html

@@ -38,7 +38,7 @@
 </a></p>
   <h1 class="p-name no-ref" id=title>CSS Grid Layout Module Level 1</h1>
   <h2 class="no-num no-toc no-ref heading settled heading" id=subtitle><span class=content>Editor’s Draft,
-    <span class=dt-updated><span class=value-title title=20131030>30 October 2013</span></span></span></h2>
+    <span class=dt-updated><span class=value-title title=20131101>1 November 2013</span></span></span></h2>
   <div data-fill-with=spec-metadata><dl><dt>This version:<dd><a class=u-url href=http://dev.w3.org/csswg/css-grid/>http://dev.w3.org/csswg/css-grid/</a><dt>Latest version:<dd><a href=http://www.w3.org/TR/css3-grid-layout/>http://www.w3.org/TR/css3-grid-layout/</a><dt>Editor’s Draft:<dd><a href=http://dev.w3.org/csswg/css-grid/>http://dev.w3.org/csswg/css-grid/</a><dt>Previous Versions:<dd><a href=http://www.w3.org/TR/2013/WD-css3-grid-layout-20130402/ rel=previous>http://www.w3.org/TR/2013/WD-css3-grid-layout-20130402/</a><dd><a href=http://www.w3.org/TR/2012/WD-css3-grid-layout-20121106/ rel=previous>http://www.w3.org/TR/2012/WD-css3-grid-layout-20121106/</a>
     <dt>Feedback:</dt>
         <dd><a href="mailto:www-style@w3.org?subject=%5Bcss-grid%5D%20feedback">www-style@w3.org</a>
@@ -490,7 +490,11 @@ <h2 class="heading settled heading" data-level=2 id=grid-concepts><span class=se
 		along the <a href=http://www.w3.org/TR/css3-writing-modes/#inline-axis>inline axis</a> (the <dfn data-dfn-type=dfn data-export="" id=row-axis>row axis<a class=self-link href=#row-axis></a></dfn>).
 		<a data-biblio-type=normative data-link-type=biblio href=#css3-writing-modes title=css3-writing-modes>[CSS3-WRITING-MODES]</a>
 
-
+<div class=figure>
+		<img alt="Image: A diagram illustrating the relationship between the Grid Element and its Tracks, Lines, Areas and Items." class=figure src=images/grid-concepts.png>
+		<p class=caption>A diagram illustrating the relationship between the <a data-link-type=dfn href=#grid-container title="grid container">grid container</a> and its tracks, lines, areas and items.
+	</div>
+--&gt;
 
 	<div class=figure>
 		<img alt="Image: Grid Lines." class=figure src=images/grid-lines.png>
@@ -688,7 +692,7 @@ <h2 class="heading settled heading" data-level=4 id=grid-items><span class=secno
 		is wrapped in an anonymous <a data-link-type=dfn href=#grid-item title="grid item">grid item</a>.
 		However, an anonymous grid item that contains only
 		<a href=http://www.w3.org/TR/CSS21/text.html#white-space-prop>white space</a>
-		is not rendered, as if it were <a class="css css-code" data-link-type=property href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display:none</a>.
+		is not rendered, as if it were <a class=css data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display:none</a>.
 
 	<p>
 		A <a data-link-type=dfn href=#grid-item title="grid item">grid item</a> establishes a new formatting context for its contents.
@@ -728,7 +732,7 @@ <h2 class="heading settled heading" data-level=4 id=grid-items><span class=secno
 		For example, a misparented <span class=css data-link-type=maybe title=table-cell>table-cell</span> child is fixed up
 		by <a href=http://www.w3.org/TR/CSS21/tables.html#anonymous-boxes>generating anonymous <span class=css data-link-type=maybe title=table>table</span> and <span class=css data-link-type=maybe title=table-row>table-row</span> elements</a> around it. <a data-biblio-type=normative data-link-type=biblio href=#css21 title=css21>[CSS21]</a>
 		This fixup must occur <em>before</em> a <a data-link-type=dfn href=#grid-container title="grid container">grid container</a>’s children are promoted to <a data-link-type=dfn href=#grid-item title="grid items">grid items</a>.
-		For example, given two contiguous child elements with <a class="css css-code" data-link-type=property href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display:table-cell</a>,
+		For example, given two contiguous child elements with <a class=css data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display:table-cell</a>,
 		an anonymous table wrapper box around them becomes the <a data-link-type=dfn href=#grid-item title="grid item">grid item</a>.
 
 	<p class=note>
@@ -1035,7 +1039,7 @@ <h4 class="heading settled heading" data-level=5.1.4 id=subgrids><span class=sec
 Subgrids: the <a class=css data-link-for=grid-template-rows data-link-type=maybe href=#valuedef-subgrid0 title=subgrid>subgrid</a> keyword</span><a class=self-link href=#subgrids></a></h4>
 
 	<p>
-		A <a data-link-type=dfn href=#grid-item title="grid item">grid item</a> can itself be a <a data-link-type=dfn href=#grid-container title="grid container">grid container</a> by giving it <a class="css css-code" data-link-type=property href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display: grid</a>;
+		A <a data-link-type=dfn href=#grid-item title="grid item">grid item</a> can itself be a <a data-link-type=dfn href=#grid-container title="grid container">grid container</a> by giving it <a class=css data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display: grid</a>;
 		in this case the layout of its contents will be independent of the layout of the grid it participates in.
 
 	<p>
@@ -1742,11 +1746,11 @@ <h2 class="heading settled heading" data-level=7 id=grid-shorthand><span class=s
 	<div class=example>
 		<p>In addition to accepting the <a class=property data-link-type=propdesc href=#propdef-grid-template title=grid-template>grid-template</a> shorthand syntax for setting up the <a data-link-type=dfn href=#explicit-grid title="explicit grid">explicit grid</a>,
 		the <a class=property data-link-type=propdesc href=#propdef-grid title=grid>grid</a> shorthand can also easily set up parameters for an auto-formatted grid.
-		For example, <a class="css css-code" data-link-type=property href=#propdef-grid title=grid>grid: rows 1fr;</a> is equivalent to
+		For example, <a class=css data-link-type=propdesc href=#propdef-grid title=grid>grid: rows 1fr;</a> is equivalent to
 		<pre>grid-template: none;
 grid-auto-columns: 1fr;
 grid-auto-rows: 1fr;
-grid-auto-flow: rows;</pre>		<p>Similarly, <a class="css css-code" data-link-type=property href=#propdef-grid title=grid>grid: columns 1fr / auto</a> is equivalent to
+grid-auto-flow: rows;</pre>		<p>Similarly, <a class=css data-link-type=propdesc href=#propdef-grid title=grid>grid: columns 1fr / auto</a> is equivalent to
 		<pre>grid-template: none;
 grid-auto-columns: 1fr;
 grid-auto-rows: auto;
@@ -2011,7 +2015,7 @@ <h3 class="heading settled heading" data-level=8.2 id=line-placement><span class
 			contributes the first such line to the <a data-link-type=dfn href=#grid-item title="grid item">grid item</a>’s <a data-link-type=dfn href=#grid-placementplacement title=placement>placement</a>.
 
 <p class=note>			Note: <a data-link-type=dfn href=#named-grid-area title="named grid areas">Named grid areas</a> automatically generate <a data-link-type=dfn href=#implicit-named-line title="implicit named lines">implicit named lines</a> of this form,
-			so specifying <a class="css css-code" data-link-type=property href=#propdef-grid-row-start title=grid-row-start>grid-row-start: foo</a> will choose the start edge of that <a data-link-type=dfn href=#named-grid-area title="named grid area">named grid area</a>
+			so specifying <a class=css data-link-type=propdesc href=#propdef-grid-row-start title=grid-row-start>grid-row-start: foo</a> will choose the start edge of that <a data-link-type=dfn href=#named-grid-area title="named grid area">named grid area</a>
 			(unless another line named <span class=css data-link-type=maybe title=foo-start>foo-start</span> was explicitly specified before it).
 
 <p>			Otherwise, if there is a <a data-link-type=dfn href=#named-line title="named line">named line</a> with the specified name,
@@ -2935,7 +2939,7 @@ <h2 class="no-num heading settled heading" id=changes><span class=content>
 		<li>Refined <a href=#abspos-items>definitions of absolutely-positioned elements</a> whose containing block is a grid container.
 		<li>Defined the <a href=#static-position>static position</a> of direct children of a <a data-link-type=dfn href=#grid-container title="grid container">grid container</a>.
 		<li>Added an option for dense packing to <a class=property data-link-type=propdesc href=#propdef-grid-auto-flow title=grid-auto-flow>grid-auto-flow</a>.
-		<li>Proposed <a class=property data-link-type=propdesc href=#propdef-grid-auto-position title=grid-auto-position>grid-auto-position</a> property so that auto-stacking items can be controlled a bit better. (But see open issues on changing <a class="css css-code" data-link-type=property href=#propdef-grid-auto-flow title=grid-auto-flow>grid-auto-flow: none</a>.)
+		<li>Proposed <a class=property data-link-type=propdesc href=#propdef-grid-auto-position title=grid-auto-position>grid-auto-position</a> property so that auto-stacking items can be controlled a bit better. (But see open issues on changing <a class=css data-link-type=propdesc href=#propdef-grid-auto-flow title=grid-auto-flow>grid-auto-flow: none</a>.)
 		<li>Rewrote and fixed errors in the <a href=#auto-placement-algo>auto-placement algorithm</a>.
 		<li>Marked <a href=#visibility-collapse>grid row/column collapsing</a> as an open issue.
 	</ul>
@@ -3211,31 +3215,31 @@ <h2 class="no-num no-ref heading settled heading" id=property-index><span class=
 <tr><th scope=row><a data-property="">grid-area</a><td>&lt;grid-line&gt; [ / &lt;grid-line&gt; ]{0,3}<td>see individual properties<td>grid items<td>see individual properties<td>see individual properties<td>visual<td>see individual properties</table></div>
 
 
-<h2 class="no-num heading settled" id=issues-index><span class=content>Issues Index</span><a class=self-link href=#issues-index></a></h2><div style="counter-reset: issue"><p class=issue>
+<h2 class="no-num heading settled" id=issues-index><span class=content>Issues Index</span><a class=self-link href=#issues-index></a></h2><div style="counter-reset: issue"><div class=issue>
 		We want the ability to collapse grid tracks
 		(similar to <a href=http://www.w3.org/TR/css3-flexbox/#visibility-collapse>collapsing flex items</a>
 		 or <a href=http://www.w3.org/TR/CSS21/tables.html#dynamic-effects>table rows/columns</a>),
 		but we’re not sure exactly how to do it.
 		Ideas welcome, please <a href="mailto:www-style@w3.org?Subject=%5Bcss-grid%5D%20Collapsing%20Grid%20Tracks">post them to www-style@w3.org</a>.
 
-<a href=#issue-011f0229> ↵ </a><p class=issue>
+<a href=#issue-011f0229> ↵ </a></div><div class=issue>
 		Win8 compat might require the <a class=css-code data-link-for=grid-auto-flow data-link-type=value href=#valuedef-none title=none>none</a> value to stay the initial value,
 		but it’s not a very good value,
 		because by default the entire contents of a grid container will end up stacked on top of each other.
 		See <a href=http://lists.w3.org/Archives/Public/www-archive/2013Aug/0024.html>proposals to address this</a>
 		while addressing use cases and back-compat.
 
-	<a href=#issue-2bda411b> ↵ </a><p class=issue>
+	<a href=#issue-2bda411b> ↵ </a></div><div class=issue>
 		These properties might not be necessary in this level,
 		if we can provide a more reasonable default behavior
 		by, e.g., searching for an empty slot to stack items into
 		instead of always using 1,1 by default.
 
-<a href=#issue-f3c0c9fd> ↵ </a><p class=issue>
+<a href=#issue-f3c0c9fd> ↵ </a></div><div class=issue>
 		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>?
 
 
-<a href=#issue-6466e536> ↵ </a><div class=issue>
+<a href=#issue-6466e536> ↵ </a></div><div class=issue>
 		<ul>
 			<li>Simple example of abspos spanning the whole grid.
 			<li>Example of abspos spanning a portion of the grid.
@@ -3251,13 +3255,13 @@ <h2 class="no-num heading settled" id=issues-index><span class=content>Issues In
 </pre>		</ul>
 	<a href=#issue-40e1e2b2> ↵ </a></div>
 
-<p class=issue>
+<div class=issue>
 		Provide a picture as example.
 
-<a href=#issue-3ca79b56> ↵ </a><p class=issue>
+<a href=#issue-3ca79b56> ↵ </a></div><div class=issue>
 			Currently this algorithm embodies several heuristics which regulate the growth of spanning <a data-link-type=dfn href=#grid-item title="grid items">Grid items</a> to accommodate certain use cases. (E.g. the game example in Figures 2 and 3 above.) These heuristics should be a normative part of this specification to ensure interoperability. To the extent additional use cases can be identified that cannot be satisfied by following the current heuristics, the normative algorithm can be updated, or additional mechanisms can be introduced for fine-grained control of content-based TrackSizingFunction.
 
-		<a href=#issue-a01f80c8> ↵ </a><p class=issue>
+		<a href=#issue-a01f80c8> ↵ </a></div><div class=issue>
 		Fill this in.
 
-<a href=#issue-b68a497e> ↵ </a></div>
+<a href=#issue-b68a497e> ↵ </a></div></div>

css-grid/Overview.src.html

@@ -1813,9 +1813,9 @@ <h2 id="placement">
 
 
 
-	The <dfn export title="grid-placement property">grid-placement properties</dfn><!--
-	-->—<wbr>the longhands 'grid-row-start', 'grid-row-end', 'grid-column-start', 'grid-column-end', and their shorthands 'grid-row', 'grid-column', and 'grid-area'—<wbr><!--
-	-->allow the author to specify a <i>grid item</i>’s <i>placement</i>
+	The <dfn export title="grid-placement property">grid-placement properties</dfn>--
+	the longhands 'grid-row-start', 'grid-row-end', 'grid-column-start', 'grid-column-end', and their shorthands 'grid-row', 'grid-column', and 'grid-area'--
+	allow the author to specify a <i>grid item</i>’s <i>placement</i>
 	by providing any (or none) of the following six pieces of information:
 
 	<table class=data style="width: auto">