Added that templates are padded with '.' if 'grid-columns' and/or

'grid-rows' have more values than the template has symbols. Added a
warning that naming slots with Hebrew or Arabic letters may cause the
CSS *code* to be displayed reversed from from how the template is
actually rendered, depending on the editor that is used to edit the
style sheet.

Author: bert-github

css3-layout/Overview.src.html

@@ -291,12 +291,12 @@ <h3>Summary and examples</h3>
 “zunflower” design</a> of the CSS Zen Garden could be done:
 
 <pre>
-#container {grid: "abc"}
-#container::slot(a) {box-shadow: 0.5em 0.5em 0.5em; z-index: 1}
-#container::slot(b) {box-shadow: 0.5em 0.5em 0.5em; margin-left: -2em}
-#intro {flow: a}
-#supportingText {flow: b}
-#linkList {flow: c}
+#container {grid: "ABC"}
+#container::slot(A) {box-shadow: 0.5em 0.5em 0.5em; z-index: 1}
+#container::slot(B) {box-shadow: 0.5em 0.5em 0.5em; margin-left: -2em}
+#intro {flow: A}
+#supportingText {flow: B}
+#linkList {flow: C}
 </pre>
 </div>
 
@@ -707,7 +707,8 @@ <h3 id=accessibility>A note about accessibility</h3>
 <h2>Declaring templates</h2>
 
 <p>Grid templates are declared with the 'grid-template', 'grid-rows',
-'grid-columns' and 'grid' properties, defined below.
+'grid-columns' properties (or the 'grid' shorthand property), defined
+below.
 
 <p>An element that has a grid template is called a <dfn>grid
 element.</dfn> More precisely: an element is a grid element if (1) it
@@ -834,12 +835,18 @@ <h3 id=grid-template >Declaring a template: 'grid-template'</h3>
 <p>Non-rectangular slots and multiple slots with the same letter are
 illegal. A template without any letter or “*” is illegal. A template
 with more than one “*” slot is illegal. Strings with different numbers
-of columns are illegal. These errors cause the declaration to be
-ignored.
+of columns (<em>before</em> padding with “.”, see below) are
+illegal. These errors cause the declaration to be ignored.
 
 <p class=note>Note: non-rectangular and disconnected regions may be
 permitted in a future update of CSS.
 
+<p>If there are fewer symbols in a string than the <span>number of
+columns</span> in the element, the string is implicitly padded with
+“.” (period) symbols. Likewise, if there are fewer strings than the
+<span>number of rows</span> in the element, additional strings
+consisting of “.” (period) symbols are implicitly added.
+
 <p>Each slot (letter or “*”) acts as a block element for its contents.
 
 <p>If the value is ''none'', then no explicit slots are defined. If
@@ -867,7 +874,14 @@ <h3 id=grid-template >Declaring a template: 'grid-template'</h3>
 </pre>
 </div>
 
+<p class=note>Authors should be aware that naming slots with Hebrew or
+Arabic letters may cause some text editors to display the CSS rule
+with the first letter of the string on the right. However, the first
+letter in each string corresponds to the first value in 'grid-columns'
+and thus represents the leftmost column in the rendering of the
+document.
 
+<!--=================================================================-->
 
 <h3 id=grid-column-sizes >Specifying the widths of columns:
 'grid-columns'</h3>
@@ -930,7 +944,7 @@ <h3 id=grid-column-sizes >Specifying the widths of columns:
 accepts certain values.
 
 <p>Each <var>&lt;col-width&gt;</var> sets the width of a column, the
-first value for the first column, the second for the second columns,
+first value for the leftmost column, the second for the second column,
 etc.
 
 <p>If there are fewer <var>&lt;col-width&gt;</var> values than
@@ -1045,6 +1059,9 @@ <h3 id=grid-row-sizes >Specifying the height of rows: 'grid-rows'</h3>
 <p class=note>Note that the syntax is the same syntax as for
 'grid-columns'
 
+<p>Each <var>&lt;row-height&gt;</var> sets the height of a row, the
+first value for the topmost row, the second for the second row, etc.
+
 <p>If there are fewer <var>&lt;row-height&gt;</var> values than
 the <span>number of rows</span> in the element, or if the value is
 ''auto'', the missing row heights are all ''auto''.