Now use article element in examples

Author: vhardy

css3-regions/Overview.html

@@ -596,8 +596,8 @@ <h3 id=named-flows-and-regions><span class=secno>1.1. </span>Named flows
    CSS regions module properties provide that mechanism.
 
   <p>The following example illustrates how the content of an
-   <code>article</code> element becomes a <a href="#named-flow0">named
-   flow</a> and how boxes marked with &lsquo;<code
+   <code>&lt;article&gt;</code> element becomes a <a
+   href="#named-flow0">named flow</a> and how boxes marked with &lsquo;<code
    class=css>region1</code>&rsquo;, &lsquo;<code
    class=css>region2</code>&rsquo;, &lsquo;<code
    class=css>region3</code>&rsquo; and &lsquo;<code
@@ -607,7 +607,7 @@ <h3 id=named-flows-and-regions><span class=secno>1.1. </span>Named flows
   <div class=example>
    <pre>
 &lt;style&gt;
-  #article {
+  article {
     <strong>flow-into: article_flow;</strong>
   }
 
@@ -1455,7 +1455,7 @@ <h3 id=the-region-overflow-property><span class=secno>3.4. </span>The
   <div class=example>
    <pre>
 &lt;style&gt;
-#article {
+article {
   flow-into: "article";
 }
 
@@ -1467,7 +1467,7 @@ <h3 id=the-region-overflow-property><span class=secno>3.4. </span>The
 
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;/div&gt;
+&lt;article&gt;...&lt;/article&gt;
 
 &lt;div id="region_1"&gt;&lt;/div&gt;
 &lt;div id="region_2"&gt;&lt;/div&gt;
@@ -1803,7 +1803,7 @@ <h2 id=multi-column-regions><span class=secno>4. </span>Multi-column
    }
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;div&gt;
+&lt;article&gt;...&lt;/article&gt;
 &lt;div id="multicol"&gt&lt;/div&gt;
 &lt;div id="remainder"&gt;&lt;/div&gt;</pre>
 
@@ -1827,7 +1827,7 @@ <h2 id=multi-column-regions><span class=secno>4. </span>Multi-column
    }
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;div&gt;
+&lt;article&gt;...&lt;/article&gt;
 &lt;div id="flex"&gt;
    &lt;div /&gt;
    &lt;div /&gt;
@@ -2556,7 +2556,7 @@ <h3 id=regions-visual-formatting-examples><span class=secno>7.4.
   <div class=example>
    <pre>
 &lt;style&gt;
-#article {
+article {
     flow-into: article;
 }
 
@@ -2592,10 +2592,10 @@ <h3 id=regions-visual-formatting-examples><span class=secno>7.4.
 
 &lt;/style&gt;       
 &lt;body&gt;
-    &lt;div id="article"&gt;
+    &lt;article&gt;
         &lt;p style="region-break-after:always;"&gt;I am not a ... &lt;/p&gt;
         &lt;p&gt;...&lt;/p&gt;
-    &lt;/div&gt;
+    &lt;/article&gt;
     &lt;div id="rA"&gt;&lt;/div&gt;
     &lt;div id="rB"&gt;&lt;/div&gt;
     &lt;div id="rC"&gt;&lt;/div&gt;
@@ -3331,7 +3331,7 @@ <h2 class=no-num id=intro-example-code>Appendix A. Example Code for
     class=highlight>/*
    * Creates the named flow 
    */</span>
-  #article {
+  article {
     <strong>flow-into: article_flow;</strong>
   }
 
@@ -3352,15 +3352,15 @@ <h2 class=no-num id=intro-example-code>Appendix A. Example Code for
      through the region chain. 
 --&gt;</span>
 
-&lt;div <em>id="article"</em>&gt;
+&lt;article&gt;
   &lt;h1&gt;Introduction&lt;/h1&gt;
   &lt;p&gt;This is an example ...&lt;/p&gt;
 
   &lt;h2&gt;More Details&lt;/h2&gt;
   &lt;p&gt;This illustrates ...&lt;/p&gt;
   &lt;p&gt;Then, the example ...&lt;/p&gt;
   &lt;p&gt;Finally, this ...&lt;/p&gt;
-&lt;/div&gt;
+&lt;/article&gt;
 
 <span
     class=highlight>&lt;!--

css3-regions/Overview.src.html

@@ -384,15 +384,15 @@ <h3 id="named-flows-and-regions">Named flows and region chains</h3>
       The CSS regions module properties provide that mechanism.</p>
 
     <p>The following example illustrates 
-      how the content of an <code>article</code> element 
+      how the content of an <code>&lt;article&gt;</code> element 
       becomes a <span>named flow</span> 
       and how boxes marked with 'region1', 'region2', 'region3' and 'region4' IDs
       become CSS Regions that consume the 'article_flow' content.</p>
 
     <div class="example">
       <pre>
 &lt;style&gt;
-  #article {
+  article {
     <strong>flow-into: article_flow;</strong>
   }
 
@@ -1304,7 +1304,7 @@ <h3 id="the-region-overflow-property">The region-overflow property</h3>
     <div class="example">
       <pre>
 &lt;style&gt;
-#article {
+article {
   flow-into: "article";
 }
 
@@ -1316,7 +1316,7 @@ <h3 id="the-region-overflow-property">The region-overflow property</h3>
 
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;/div&gt;
+&lt;article&gt;...&lt;/article&gt;
 
 &lt;div id="region_1"&gt;&lt;/div&gt;
 &lt;div id="region_2"&gt;&lt;/div&gt;
@@ -1610,7 +1610,7 @@ <h2 id="multi-column-regions">Multi-column regions</h2>
    }
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;div&gt;
+&lt;article&gt;...&lt;/article&gt;
 &lt;div id="multicol"&gt&lt;/div&gt;
 &lt;div id="remainder"&gt;&lt;/div&gt;</pre>
         <p>is equivalent in rendering to, for example:</p>
@@ -1632,7 +1632,7 @@ <h2 id="multi-column-regions">Multi-column regions</h2>
    }
 &lt;/style&gt;
 
-&lt;div id="article"&gt;...&lt;div&gt;
+&lt;article&gt;...&lt;/article&gt;
 &lt;div id="flex"&gt;
    &lt;div /&gt;
    &lt;div /&gt;
@@ -2243,7 +2243,7 @@ <h3 id="regions-visual-formatting-examples">Regions visual formatting example</h
     <div class="example">
         <pre>
 &lt;style&gt;
-#article {
+article {
     flow-into: article;
 }
 
@@ -2279,10 +2279,10 @@ <h3 id="regions-visual-formatting-examples">Regions visual formatting example</h
 
 &lt;/style&gt;       
 &lt;body&gt;
-    &lt;div id="article"&gt;
+    &lt;article&gt;
         &lt;p style="region-break-after:always;"&gt;I am not a ... &lt;/p&gt;
         &lt;p&gt;...&lt;/p&gt;
-    &lt;/div&gt;
+    &lt;/article&gt;
     &lt;div id="rA"&gt;&lt;/div&gt;
     &lt;div id="rB"&gt;&lt;/div&gt;
     &lt;div id="rC"&gt;&lt;/div&gt;
@@ -2706,7 +2706,7 @@ <h2 id="intro-example-code" class="no-num">Appendix A. Example Code for Introduc
   <span class="highlight">/*
    * Creates the named flow 
    */</span>
-  #article {
+  article {
     <strong>flow-into: article_flow;</strong>
   }
 
@@ -2725,15 +2725,15 @@ <h2 id="intro-example-code" class="no-num">Appendix A. Example Code for Introduc
      through the region chain. 
 --&gt;</span>
 
-&lt;div <em>id="article"</em>&gt;
+&lt;article</em>&gt;
   &lt;h1&gt;Introduction&lt;/h1&gt;
   &lt;p&gt;This is an example ...&lt;/p&gt;
 
   &lt;h2&gt;More Details&lt;/h2&gt;
   &lt;p&gt;This illustrates ...&lt;/p&gt;
   &lt;p&gt;Then, the example ...&lt;/p&gt;
   &lt;p&gt;Finally, this ...&lt;/p&gt;
-&lt;/div&gt;
+&lt;/article&gt;
 
 <span class="highlight">&lt;!--
      For this example, we layout the regions with a grid.