W3C home > Mailing lists > Public > public-css-commits@w3.org > November 2011

csswg/css3-exclusions Exclusions.src.html,1.16,1.17 Overview.html,1.16,1.17

From: Rossen Atanassov via cvs-syncmail <cvsmail@w3.org>
Date: Tue, 15 Nov 2011 19:35:19 +0000
To: public-css-commits@w3.org
Message-Id: <E1RQOmt-0002Ba-OP@lionel-hutz.w3.org>
Update of /sources/public/csswg/css3-exclusions
In directory hutz:/tmp/cvs-serv8388

Modified Files:
	Exclusions.src.html Overview.html 
Log Message:
Changing the wrap-flow property values 'left' and 'right' to 'start' and 'end'.

Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css3-exclusions/Overview.html,v
retrieving revision 1.16
retrieving revision 1.17
diff -u -d -r1.16 -r1.17
--- Overview.html	31 Oct 2011 18:18:43 -0000	1.16
+++ Overview.html	15 Nov 2011 19:35:17 -0000	1.17
@@ -87,14 +87,14 @@
 
    <h1 id=css-exclusions-module>CSS exclusions and shapes</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 31 October
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 15 November
     2011</h2>
 
    <dl>
     <dt>This version:
 
     <dd><a
-     href="http://www.w3.org/TR/2011/ED-css3-exclusions-20111031/">http://www.w3.org/csswg/css3-exclusions/</a>
+     href="http://www.w3.org/TR/2011/ED-css3-exclusions-20111115/">http://www.w3.org/csswg/css3-exclusions/</a>
 
     <dt>Latest version:
 
@@ -447,8 +447,8 @@
     <tr>
      <th>Value:
 
-     <td><var>auto</var> | <var>both</var> | <var>left</var> |
-      <var>right</var> | <var>maximum</var> | <var>clear</var>
+     <td><var>auto</var> | <var>both</var> | <var>start</var> |
+      <var>end</var> | <var>maximum</var> | <var>clear</var>
 
     <tr>
      <th>Initial:
@@ -495,33 +495,34 @@
 
    <dd> Inline flow content can flow on all sides of the exclusion.
 
-   <dt><dfn id=left title="'wrap-flow'!!'left'">left</dfn>
+   <dt><dfn id=start title="'wrap-flow'!!'start'">start</dfn>
 
-   <dd> Inline flow content can wrap on the left side of the exclusion but
-    must leave the area to the right of the exclusion empty.
+   <dd> Inline flow content can wrap on the start edge of the exclusion box
+    but must leave the area to end edge of the exclusion box empty.
 
-   <dt><dfn id=right title="'wrap-flow'!!'right'">right</dfn>
+   <dt><dfn id=end title="'wrap-flow'!!'end'">end</dfn>
 
-   <dd> Inline flow content can wrap on the right side of the exclusion but
-    must leave the area to the left of the exclusion empty.
+   <dd> Inline flow content can wrap on the end side of the exclusion box but
+    must leave the area to the start edge of the exclusion box empty.
 
    <dt><dfn id=maximum title="'wrap-flow'!!'maximum'">maximum</dfn>
 
    <dd> Inline flow content can wrap on the side of the exclusion with the
     largest available space for the given line, and must leave the other side
-    of the exclusion empty..
+    of the exclusion empty.
 
    <dt><dfn id=clear title="'wrap-flow'!!'clear'">clear</dfn>
 
    <dd> Inline flow content can only wrap on top and bottom of the exclusion
-    and must leave the areas to the left and right of the exclusion empty.
+    and must leave the areas to the start and end edges of the exclusion box
+    empty.
   </dl>
 
-  <p id=setting-the-wrap-flow-property-to-both-l> Setting the &lsquo;<a
+  <p id=setting-the-wrap-flow-property-to-both-s> Setting the &lsquo;<a
    href="#wrap-flow"><code class=property>wrap-flow</code></a>&rsquo;
    property to &lsquo;<code class=property>both</code>&rsquo;, &lsquo;<code
-   class=property>left</code>&rsquo;, &lsquo;<code
-   class=property>right</code>&rsquo;, &lsquo;<code
+   class=property>start</code>&rsquo;, &lsquo;<code
+   class=property>end</code>&rsquo;, &lsquo;<code
    class=property>maximum</code>&rsquo; or &lsquo;<code
    class=property>clear</code>&rsquo; on an element makes that element an
    <span>exclusion element. It's <span>exclusion shape</span> is contributed
@@ -559,8 +560,8 @@
     &lsquo;<a href="#wrap-flow"><code
     class=property>wrap-flow</code></a>&rsquo; set to &lsquo;<code
     class=property>both</code>&rsquo;, &lsquo;<code
-    class=property>left</code>&rsquo;, &lsquo;<code
-    class=property>right</code>&rsquo; and &lsquo;<code
+    class=property>start</code>&rsquo;, &lsquo;<code
+    class=property>end</code>&rsquo; and &lsquo;<code
     class=property>clear</code>&rsquo; respectively. The lighter gray areas
     show the additional areas that are excluded for inline layout as a result
     of the &lsquo;<a href="#wrap-flow"><code
@@ -569,7 +570,7 @@
     used for inline layout because the &lsquo;<a href="#wrap-flow"><code
     class=property>wrap-flow</code></a>&rsquo; for &lsquo;<code
     class=property>B</code>&rsquo; is &lsquo;<code
-    class=property>left</code>&rsquo;.</p>
+    class=property>start</code>&rsquo;.</p>
 
    <p id=the-background-blue-area-shows-what-area>The background &lsquo;<code
     class=property>blue</code>&rsquo; area shows what areas are available for
@@ -612,15 +613,15 @@
        src="images/exclusion_wrap_side_both.png">
 
      <tr>
-      <td><code class=html>#exclusion{ wrap-flow: left; }</code>
+      <td><code class=html>#exclusion{ wrap-flow: start; }</code>
 
-      <td><code class=html>#exclusion{ wrap-flow: right; }</code>
+      <td><code class=html>#exclusion{ wrap-flow: end; }</code>
 
      <tr>
-      <td><img alt="Example rendering for wrap-side: left"
+      <td><img alt="Example rendering for wrap-side: start"
        src="images/exclusion_wrap_side_left.png">
 
-      <td><img alt="Example rendering for wrap-side: right"
+      <td><img alt="Example rendering for wrap-side: end"
        src="images/exclusion_wrap_side_right.png">
 
      <tr>
@@ -1374,8 +1375,8 @@
     and their &lsquo;<a href="#wrap-flow"><code
     class=property>wrap-flow</code></a>&rsquo; property set to &lsquo;<code
     class=property>both</code>&rsquo;, &lsquo;<code
-    class=property>left</code>&rsquo;, &lsquo;<code
-    class=property>right</code>&rsquo; and &lsquo;<code
+    class=property>start</code>&rsquo;, &lsquo;<code
+    class=property>end</code>&rsquo; and &lsquo;<code
     class=property>clear</code>&rsquo;, respectively.</p>
 
    <p id=as-illustrated-in-the-picture-when-an-ex>As illustrated in the
@@ -1950,15 +1951,15 @@
      <li>&lsquo;<code class=property>clear</code>&rsquo;, <a href="#clear"
       title="'wrap-flow', 'clear'"><strong>3.1.1.</strong></a>
 
-     <li>&lsquo;<code class=property>left</code>&rsquo;, <a href="#left"
-      title="'wrap-flow', 'left'"><strong>3.1.1.</strong></a>
+     <li>&lsquo;<code class=property>end</code>&rsquo;, <a href="#end"
+      title="'wrap-flow', 'end'"><strong>3.1.1.</strong></a>
 
      <li>&lsquo;<code class=property>maximum</code>&rsquo;, <a
       href="#maximum"
       title="'wrap-flow', 'maximum'"><strong>3.1.1.</strong></a>
 
-     <li>&lsquo;<code class=property>right</code>&rsquo;, <a href="#right"
-      title="'wrap-flow', 'right'"><strong>3.1.1.</strong></a>
+     <li>&lsquo;<code class=property>start</code>&rsquo;, <a href="#start"
+      title="'wrap-flow', 'start'"><strong>3.1.1.</strong></a>
     </ul>
 
    <li>&lsquo;<a href="#wrap-margin"><code
@@ -2071,7 +2072,7 @@
     <tr>
      <th><a class=property href="#wrap-flow">wrap-flow</a>
 
-     <td>auto | both | left | right | maximum | clear
+     <td>auto | both | start | end | maximum | clear
 
      <td>auto
 

Index: Exclusions.src.html
===================================================================
RCS file: /sources/public/csswg/css3-exclusions/Exclusions.src.html,v
retrieving revision 1.16
retrieving revision 1.17
diff -u -d -r1.16 -r1.17
--- Exclusions.src.html	31 Oct 2011 18:18:43 -0000	1.16
+++ Exclusions.src.html	15 Nov 2011 19:35:17 -0000	1.17
@@ -220,7 +220,7 @@
         </tr>
         <tr>
             <th>Value:</th>
-            <td><var>auto</var> | <var>both</var> | <var>left</var> | <var>right</var> | <var>maximum</var> | <var>clear</var></td>
+            <td><var>auto</var> | <var>both</var> | <var>start</var> | <var>end</var> | <var>maximum</var> | <var>clear</var></td>
         </tr>
         <tr>
             <th>Initial:</th>
@@ -258,31 +258,31 @@
         <dd>
             Inline flow content can flow on all sides of the exclusion.
         </dd>
-        <dt><dfn title="'wrap-flow'!!'left'">left</dfn></dt>
+        <dt><dfn title="'wrap-flow'!!'start'">start</dfn></dt>
         <dd>
-            Inline flow content can wrap on the left side of the exclusion but must leave
-            the area to the right of the exclusion empty.
+            Inline flow content can wrap on the start edge of the exclusion area but must leave
+            the area to end edge of the exclusion area empty.
         </dd>
-        <dt><dfn title="'wrap-flow'!!'right'">right</dfn></dt>
+        <dt><dfn title="'wrap-flow'!!'end'">end</dfn></dt>
         <dd>
-            Inline flow content can wrap on the right side of the exclusion but must leave
-            the area to the left of the exclusion empty.
+            Inline flow content can wrap on the end side of the exclusion area but must leave
+            the area to the start edge of the exclusion area empty.
         </dd>
         <dt><dfn title="'wrap-flow'!!'maximum'">maximum</dfn></dt>
         <dd>
             Inline flow content can wrap on the side of the exclusion with the largest 
             available space for the given line, and must leave the other side of the exclusion
-            empty..
+            empty.
         </dd>
         <dt><dfn title="'wrap-flow'!!'clear'">clear</dfn></dt>
         <dd>
             Inline flow content can only wrap on top and bottom of the exclusion and must leave
-            the areas to the left and right of the exclusion empty.
+            the areas to the start and end edges of the exclusion box empty.
         </dd>
     </dl>
 
     <p>
-        Setting the 'wrap-flow' property to 'both', 'left', 'right', 'maximum' or 'clear' on an 
+        Setting the 'wrap-flow' property to 'both', 'start', 'end', 'maximum' or 'clear' on an 
         element makes that element an <span>exclusion element</a>. It's <span>exclusion shape</span>
         is contributed to its containing block's wrapping context, causing the containing block's descendants 
         to wrap around its exclusion area.
@@ -311,10 +311,10 @@
         <p>The above figure illustrates how exclusions combine. The red box represents an element's 
         content box. The A, B, C and D darker gray boxes represent exclusions in the element's
         wrapping context. A, B, C and D have their respective 
-        'wrap-flow' set to 'both', 'left', 'right' and 'clear' respectively. The lighter gray
+        'wrap-flow' set to 'both', 'start', 'end' and 'clear' respectively. The lighter gray
         areas show the additional areas that are excluded for inline layout as a result of the 
         'wrap-flow' value. For example, the area to the right of 'B' cannot be used for inline
-        layout because the 'wrap-flow' for 'B' is 'left'.</p>
+        layout because the 'wrap-flow' for 'B' is 'start'.</p>
         
         <p>The background 'blue' area shows what areas are available for inline content layout.
             All areas represented with a light or dark shade of gray are not available for inline
@@ -349,12 +349,12 @@
                 <td><img src="images/exclusion_wrap_side_both.png" alt="Example rendering for wrap-side: both" /></td>
             </tr>
             <tr>
-                <td><code class="html">#exclusion{ wrap-flow: left; }</code></td>
-                <td><code class="html">#exclusion{ wrap-flow: right; }</code></td>
+                <td><code class="html">#exclusion{ wrap-flow: start; }</code></td>
+                <td><code class="html">#exclusion{ wrap-flow: end; }</code></td>
             </tr>
             <tr>
-                <td><img src="images/exclusion_wrap_side_left.png" alt="Example rendering for wrap-side: left" /></td>
-                <td><img src="images/exclusion_wrap_side_right.png" alt="Example rendering for wrap-side: right" /></td>
+                <td><img src="images/exclusion_wrap_side_left.png" alt="Example rendering for wrap-side: start" /></td>
+                <td><img src="images/exclusion_wrap_side_right.png" alt="Example rendering for wrap-side: end" /></td>
             </tr>
             <tr>
                 <td><code class="html">#exclusion{ wrap-flow: maximum; }</code></td>
@@ -938,7 +938,7 @@
           <p>The above figure shows how 'shape-outside' shapes impact the exclusion areas.
               The red box represents an element's content box and 'A', 'B', 'C' and 'C'
               represent exclusions with a complex shape and their 'wrap-flow' property set
-              to 'both', 'left', 'right' and 'clear', respectively.</p>
+              to 'both', 'start', 'end' and 'clear', respectively.</p>
               
           <p>As illustrated in the picture, when an exclusion allows wrapping on all sides, 
               text can flow inside 'holes' in the exclusion (as for exclusion 'A'). Otherwise,
Received on Tuesday, 15 November 2011 19:35:26 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 15 November 2011 19:35:27 GMT