removing (commenting out) ascii art

Author: howcom

css3-gcpm/Overview.src.html

@@ -2549,8 +2549,9 @@ <h3>Float intrusion in multicol elements</h3>
 middle column is a long word that is clipped in the middle of the
 column gap.
 
-<img src=1.png>
+<p><img src=1.png>
 
+<!--
 <div class=cols>
 
 <p>Ab cde fgh i jkl. Mno<br> 
@@ -2598,6 +2599,7 @@ <h3>Float intrusion in multicol elements</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -2613,8 +2615,8 @@ <h3>Float intrusion in multicol elements</h3>
 
 <p>In this example, the image naturally appears in the last column. Due to being floated to the right, the image will intrude into the neighboring column to the left.
 
-<img src=2.png>
-
+<p><img src=2.png>
+<!--
 <div class=cols style="height: 186px">
 
 <p>
@@ -2657,6 +2659,8 @@ <h3>Float intrusion in multicol elements</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
+
 
 </div>
 
@@ -2799,8 +2803,9 @@ <h3>The 'float-offset' property</h3>
 
 <p>This code can be rendered as:
 
-<img src=3.png>
+<p><img src=3.png>
 
+<!--
 <div class=cols>
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.
 <br><br><br><br><br><br><br>
@@ -2864,7 +2869,7 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
-
+-->
 
 </div>
 
@@ -2883,8 +2888,9 @@ <h3>The 'float-offset' property</h3>
 
 <p>The column box is the containing block for floats, so if an image naturally appears in the first column it will float to its bottom:
 
-<img src=5.png>
+<p><img src=5.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -2910,6 +2916,7 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -2927,8 +2934,9 @@ <h3>The 'float-offset' property</h3>
 <p>The '1gr' value on
 'width' is equal to the width of the containing block. Here is a possible rendering:
 
-<img src=6.png>
+<p><img src=6.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -2955,7 +2963,7 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
-
+-->
 
 </div>
 
@@ -2971,8 +2979,9 @@ <h3>The 'float-offset' property</h3>
   width: 1gr }
 </pre>
 
-<img src=7.png>
+<p><img src=7.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -3000,6 +3009,8 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 325px"></div>
 </div>
 
+-->
+
 <p>Assuming a three-column layout, the same rendering can be achieved
 by floating the element to the right instead:
 
@@ -3031,9 +3042,9 @@ <h3>The 'float-offset' property</h3>
 rendering.
 
 
-<img src=8.png>
-
+<p><img src=8.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -3057,6 +3068,7 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -3074,8 +3086,9 @@ <h3>The 'float-offset' property</h3>
 <p>The code above floats the element to the top right of the multi-column element. Further, it sets the width of the image to the width of one
 column plus one column gap. Here is a possible rendering. 
 
-<img src=9.png>
+<p><img src=9.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -3102,6 +3115,7 @@ <h3>The 'float-offset' property</h3>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -3119,8 +3133,9 @@ <h3>The 'float-offset' property</h3>
 <p>The code above floats the element to the top right of the multi-column element. Further, it sets the width of the image to the width of one
 column plus half the column gap.
 
-<img src=10.png>
+<p><img src=10.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.<br>
@@ -3142,11 +3157,11 @@ <h3>The 'float-offset' property</h3>
 Sed imp er di et ris.<br>Cur abi tur et sapen.
 </div>
 
-
 <div class=rep style="top: 0; left: 337.5px; width: 163px"></div>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -3169,8 +3184,9 @@ <h3>The 'float-offset' property</h3>
 the one next to it. Vertically, element should be in the middle of the
 column. Here is a possible rendering:
 
-<img src=11.png> 
+<p><img src=11.png> 
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.
@@ -3192,11 +3208,11 @@ <h3>The 'float-offset' property</h3>
 luctu<br> feugiat quis enim.<br> Cum sociis natoque<br> 
 penatibus et magni.</div>
 
-
 <div class=rep style="left: 50px; width: 220px"></div>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>
 
@@ -3215,17 +3231,16 @@ <h3>The 'float-offset' property</h3>
 
 <p>The only difference between this and the previous example is the horizontal value on 'float-offset'. The value ''1.25gr'' means that a point 25% into the image in the inline direction will be aligned with a point 25% into the column gap. Here is a possible rendering:
 
-<img src=12.png>
+<p><img src=12.png>
 
+<!--
 <div class=cols>
 
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.
 <br>Sed imper di et<br>ris. Cur abi tur<br> et sapen. Fusce<br> sed ligula a sic<br> turpis.
 Lorem<br> ipsum dolor sit<br> amet. Namat jus.
 Sed<br> imper di et ris curit.
 
-
-
 <div style="position: absolute; left: 175px; top: 0; z-index: 6;">
 <p>Lorem ipsum dolor<br>sit amet. Nam at jus.
 <div style="margin-left: 100px">
@@ -3242,11 +3257,11 @@ <h3>The 'float-offset' property</h3>
 luctu<br> feugiat quis enim.<br> Cum sociis natoque<br> 
 penatibus et magni.</div>
 
-
 <div class=rep style="left: 120px; width: 150px"></div>
 <div class=gap style="left: 150px"></div>
 <div class=gap style="left: 325px"></div>
 </div>
+-->
 
 </div>