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

csswg/css3-gcpm Overview.src.html,1.157,1.158

From: (wrong string) åkon Wium Lie via cvs-syncmail <cvsmail@w3.org>
Date: Mon, 31 Oct 2011 06:28:11 +0000
To: public-css-commits@w3.org
Message-Id: <E1RKlLv-0007r9-7H@lionel-hutz.w3.org>
Update of /sources/public/csswg/css3-gcpm
In directory hutz:/tmp/cvs-serv30185

Modified Files:
	Overview.src.html 
Log Message:
revising float-offset

Index: Overview.src.html
===================================================================
RCS file: /sources/public/csswg/css3-gcpm/Overview.src.html,v
retrieving revision 1.157
retrieving revision 1.158
diff -u -d -r1.157 -r1.158
--- Overview.src.html	31 Oct 2011 05:55:00 -0000	1.157
+++ Overview.src.html	31 Oct 2011 06:28:09 -0000	1.158
@@ -2768,7 +2768,7 @@
       <td>no
     <tr>
       <td><em>Percentages:</em>
-      <td>refer to width and height of containing block
+      <td>see prose
     <tr>
       <td><em>Media:</em>
       <td>visual, paged
@@ -2777,62 +2777,44 @@
       <td>one or two absolute lengths
 </table>
 
-<p>This property pushes floated elements in the opposite direction of
-the where they have been floated with 'float'. If one value is
-specified, it is the horizontal offset. If two values are specified,
-the first is the horizontal and the second is the vertical offset. If
-an element has only been floated horizontally (e.g., by setting
-'float: right'), this property will only offset the float
-horizontally, even if a vertical value also has been specified.
-Likewise, if an element has only been floated vertically, this
-property will only offset the float vertically. If an element has been
-floated both horizontally and vertically, this property will offset
-both horizontally and vertically. If no vertical value has been
-specified, the vertical offset is set to zero.
+<p>This property pushes a float in opposite direction of the where
+it has been floated with 'float'. If one value is specified, it is
+the horizontal offset. If two values are specified, the first is the
+horizontal and the second is the vertical offset. If no vertical value
+has been specified, the vertical offset is set to zero. 
+
+<p>Negative values are allowed; a negative values will push the float
+in the same direction as it has been floated with 'float'
+
+<p>The float will never be pushed outside the content edges
+of the multicol element due to a setting on 'float-offset'.
+
+<p>Percentage values refer to the width/height of the float plus a fraction of the column gap. 
 
 <div class=example>
 <pre>img { 
-  float: top left;
-  float-offset: 50% 50%;
-  width: 100%;
+  column-gap: 1em;
+  float: top right;
+  float-offset: -50% 3em;
+  width: 120%;
 }
 </pre>
 
-The first rule in the code above floats images to the top left of its natural column. The second rule pushes the float in the opposite directions: to the right and downwards. The horizontal component (''50$'') means that the horizontal middle of the element should be in the middle of the gap between the left-most column and 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>Assuming a three-column layout, the same rendering can be achieved
-by floating the element to the right instead:
-
-<pre>
-div.quote { 
-  float: top right multicol; 
-  float-offset: 2gr; 
-  width: 1gr }
-</pre>
-
-
 </div>
 
-<p>The floated element will never be pushed outside the content edges
-of the multicol element due to 'float-offset'.
 
 <div class="example">
 
 <pre>
 img {
-  float: top right multicol;
-  width: 3gr;
+  float: top right;
+  width: 100%;
+  float-offset: -80% 2em;
 }
 </pre>
 
-<p>The code above floats the element to the top right of the
-multi-column element. Further, it sets the width of images to the
-width of two columns plus the gap between them. Here is a possible
-rendering.
-
-
 <img src=12.png>
 
 </div>
Received on Monday, 31 October 2011 06:31:44 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 31 October 2011 06:31:44 GMT