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

csswg/css-line-grid Overview.html,1.1,1.2 Overview.src.html,1.1,1.2

From: Ishii Koji via cvs-syncmail <cvsmail@w3.org>
Date: Thu, 28 Apr 2011 04:55:27 +0000
To: public-css-commits@w3.org
Message-Id: <E1QFJGB-0006i2-R6@lionel-hutz.w3.org>
Update of /sources/public/csswg/css-line-grid
In directory hutz:/tmp/cvs-serv25774

Modified Files:
	Overview.html Overview.src.html 
Log Message:


Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css-line-grid/Overview.html,v
retrieving revision 1.1
retrieving revision 1.2
diff -u -d -r1.1 -r1.2
--- Overview.html	27 Apr 2011 05:37:39 -0000	1.1
+++ Overview.html	28 Apr 2011 04:55:25 -0000	1.2
@@ -11,9 +11,6 @@
   type="text/css">
 
   <style type="text/css">
-    .right {
-    	float:right;
-    }
   </style>
 
  <body>
@@ -23,13 +20,13 @@
 
    <h1>CSS Line Grid Module</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 26 April 2011</h2>
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 28 April 2011</h2>
 
    <dl>
     <dt>This version:
 
-    <dd><a href="http://www.w3.org/TR/2011/ED-unknown-shortname-20110426">
-     http://www.w3.org/TR/2011/ED-unknown-shortname-20110426</a> <!--
+    <dd><a href="http://www.w3.org/TR/2011/ED-unknown-shortname-20110428">
+     http://www.w3.org/TR/2011/ED-unknown-shortname-20110428</a> <!--
   <dt>Latest version:
     <dd><a href="http://www.w3.org/TR/css-line-grid">
     http://www.w3.org/TR/css-line-grid</a>
@@ -137,9 +134,9 @@
    <li><a href="#defining-grids"><span class=secno>2. </span>Defining
     Grids</a>
     <ul class=toc>
-     <li><a href="#H1"><span class=secno>2.1. </span>Define Line Grids: the
-      &lsquo;<code class=property>layout-grid-line</code>&rsquo; property</a>
-      
+     <li><a href="#layout-grid-line-prop"><span class=secno>2.1.
+      </span>Define Line Grids: the &lsquo;<code
+      class=property>layout-grid-line</code>&rsquo; property</a>
     </ul>
 
    <li><a href="#using-grids"><span class=secno>3. </span>Using Grids</a>
@@ -150,15 +147,14 @@
 
      <li><a href="#grid-shorthand-the-layout-grid-property"><span
       class=secno>3.2. </span>Grid Shorthand: the &lsquo;<code
-      class=css>layout-grid</code>&rsquo; property</a>
+      class=property>layout-grid</code>&rsquo; property</a>
 
-     <li><a href="#the-gd-length-unit"><span class=secno>3.3. </span>The
+     <li><a href="#grid-length-unit"><span class=secno>3.3. </span>The
       &lsquo;<code class=css>gd</code>&rsquo; length unit</a>
 
-     <li><a href="#rounding-down-to-multiple-of-units-gd-an"><span
-      class=secno>3.4. </span>Rounding Down to Multiple of Units:
-      &lsquo;<code class=css>*gd</code>&rsquo; and &lsquo;<code
-      class=css>*em</code>&rsquo;</a>
+     <li><a href="#round-length"><span class=secno>3.4. </span>Rounding Down
+      to Multiple of Units: &lsquo;<code class=css>*gd</code>&rsquo; and
+      &lsquo;<code class=css>*em</code>&rsquo;</a>
     </ul>
 
    <li><a href="#conformance"><span class=secno>4. </span> Conformance</a>
@@ -209,14 +205,18 @@
    <li>Align lines between columns in multi-column documents.
 
    <li>Layout lines at the same position in every page in paged media.
-    Keeping the position of the bottom line of a page has benefits from
-    design perspective. This also results better readability on duplex
-    printing, two pages spreads, or when displaying on slow display devices
-    like e-ink.
+    Keeping the position of the bottom line of a page has benefits for design
+    and readability. This also results better readability on duplex printing,
+    two pages spreads, or when displaying on slow display devices like e-ink.
 
-   <li>East Asian layouts require the use of grid layout more often than
+   <li>East Asian layouts require the use of vertical rhythm more often than
     other scripts does, even in single column, non-paged media documents, as
     defined in <a href="#JLREQ" rel=biblioentry>[JLREQ]<!--{{JLREQ}}--></a>.
+
+   <li>In East Asian documents, it is often desirable to make the line width
+    to be multiple of <em>em</em>. Most East Asian characters have 1em
+    advance, and most East Asian documents are justified, so this minimizes
+    the case where justification needs to expand lines.
   </ul>
 
   <p>There are several types of objects in a document that can break the
@@ -242,9 +242,7 @@
 
   <p>It is important to control these capabilities independently, so that
    align to grids can be turned off for tables for example, but can be turned
-   back on for the following text to the original grids. For example,
-   oftentimes, text in tables do not align to line grids. But text following
-   the table should align to the same grids as the text before the table.
+   back on for the following text to the original grids.
 
   <h3 id=placement><span class=secno>1.2. </span>Module Interactions</h3>
 
@@ -304,8 +302,8 @@
 
   <h2 id=defining-grids><span class=secno>2. </span>Defining Grids</h2>
 
-  <h3 id=H1><span class=secno>2.1. </span>Define Line Grids: the &lsquo;<a
-   href="#layout-grid-line"><code
+  <h3 id=layout-grid-line-prop><span class=secno>2.1. </span>Define Line
+   Grids: the &lsquo;<a href="#layout-grid-line"><code
    class=property>layout-grid-line</code></a>&rsquo; property</h3>
 
   <table class=propdef>
@@ -351,7 +349,13 @@
      <td>specified value
   </table>
 
-  <p class=issue>TBD
+  <p class=issue>TBD: I expect this to be very similar to the one in <a
+   href="http://www.w3.org/TR/2001/WD-css3-text-20010517/#layout-grid-line-prop">CSS3
+   module: text WD 20010517</a>.
+
+  <p class=issue>Grid origin should be defined by the element that has this
+   property. In that case, should it inherit, or not inherit value but
+   inherit grid?
 
   <h2 id=using-grids><span class=secno>3. </span>Using Grids</h2>
 
@@ -409,7 +413,7 @@
    <dt><dfn id=none title="layout-grid-mode::none">&lsquo;<code
     class=css>none</code>&rsquo;</dfn>
 
-   <dd>Do not align any objects to grids.
+   <dd>Do not align any objects to the grids.
 
    <dt><dfn id=block title="layout-grid-mode::block">&lsquo;<code
     class=css>block</code>&rsquo;</dfn>
@@ -466,29 +470,30 @@
    class=property>layout-grid-line</code></a>&rsquo; property.
 
   <div class=example>
-   <p>When a different size of text like headings wraps, it is usually
-    aligned to grids as a block and lines within the block do not align.</p>
-
-   <div class=figure> <img alt="A line of large text wraps within line grids"
+   <div class=sidefigure> <img alt="Large text wraps within line grids"
     height=244 src=line-grid-wrap.png width=276>
-    <p class=caption>A line of large text wraps within line grids.</p>
+    <p class=caption>Large text wraps within line grids.</p>
    </div>
 
+   <p>When a different size of text like headings wraps, it is usually
+    aligned to grids as a block and lines within the block do not align.</p>
+
    <p>This effect can be achieved by the following code:</p>
 
    <pre><code class=css>
 <!-- -->body { line-grid-mode: line; }
 <!-- -->h1 { line-grid-mode: block; }
 <!-- --></code></pre>
+   <br style="clear:both;">
   </div>
 
   <h3 id=grid-shorthand-the-layout-grid-property><span class=secno>3.2.
    </span>Grid Shorthand: the &lsquo;<code
-   class=css>layout-grid</code>&rsquo; property</h3>
+   class=property>layout-grid</code>&rsquo; property</h3>
 
   <p class=issue>TBD
 
-  <h3 id=the-gd-length-unit><span class=secno>3.3. </span>The &lsquo;<code
+  <h3 id=grid-length-unit><span class=secno>3.3. </span>The &lsquo;<code
    class=css><span class=index id=gd title="length
    unit::gd">gd</span></code>&rsquo; length unit</h3>
 
@@ -510,33 +515,26 @@
   <p>If no grid is specified, the gd unit should be treated the same as the
    em unit.
 
-  <h3 id=rounding-down-to-multiple-of-units-gd-an><span class=secno>3.4.
-   </span>Rounding Down to Multiple of Units: &lsquo;<code class=css><span
-   class=index id=gd0 title="length unit::*gd">*gd</span></code>&rsquo; and
-   &lsquo;<code class=css><span class=index id=em title="length
-   unit::*em">*em</span></code>&rsquo;</h3>
+  <p class=issue>Just copied from old WD, need to refresh
+
+  <h3 id=round-length><span class=secno>3.4. </span>Rounding Down to Multiple
+   of Units: &lsquo;<code class=css><span class=index id=gd0 title="length
+   unit::*gd">*gd</span></code>&rsquo; and &lsquo;<code class=css><span
+   class=index id=em title="length unit::*em">*em</span></code>&rsquo;</h3>
 
   <p>The &lsquo;<code class=property>width</code>&rsquo; and &lsquo;<code
    class=property>height</code>&rsquo; properties accept &lsquo;<code
    class=css>*gd</code>&rsquo; and &lsquo;<code class=css>*em</code>&rsquo;
-   values. This syntax computes to &lsquo;<code class=css>auto</code>&rsquo;,
+   values. These values compute to &lsquo;<code class=css>auto</code>&rsquo;,
    and then the result will be round down to the largest multiple of the
    specified unit that is equal to or less than the original computed value.
 
-  <p>The half of the fraction is added to each margin of the direction; if it
-   is used for &lsquo;<code class=property>height</code>&rsquo;, the half of
-   fraction is added to the top and bottom margins, and if for &lsquo;<code
+  <p>The fraction is distributed evenly to each side margins. If it is used
+   for &lsquo;<code class=property>height</code>&rsquo;, the half of fraction
+   is added to the top and bottom margins, and if for &lsquo;<code
    class=property>width</code>&rsquo;, to the left and right margins.
 
-  <div class=example>
-   <pre><code class=css>
-<!-- -->body {
-<!-- -->  width: *em;
-<!-- -->  height: *gd;
-<!-- -->  margin: 3em 2gd 3em 3gd;
-<!-- -->}
-<!-- --></code></pre>
-  </div>
+  <p class=issue>Should this be a property instead?
 
   <h2 id=conformance><span class=secno>4. </span> Conformance</h2>
 

Index: Overview.src.html
===================================================================
RCS file: /sources/public/csswg/css-line-grid/Overview.src.html,v
retrieving revision 1.1
retrieving revision 1.2
diff -u -d -r1.1 -r1.2
--- Overview.src.html	27 Apr 2011 05:37:40 -0000	1.1
+++ Overview.src.html	28 Apr 2011 04:55:25 -0000	1.2
@@ -8,9 +8,6 @@
   <link rel="stylesheet" type="text/css"
         href="http://www.w3.org/StyleSheets/TR/W3C-ED.css">
   <style type="text/css">
-    .right {
-    	float:right;
-    }
   </style>
 </head>
 
@@ -80,14 +77,20 @@
     <li>Keep vertical rhythm for better readability.</li>
     <li>Align lines between columns in multi-column documents.</li>
     <li>Layout lines at the same position in every page in paged media.
-      Keeping the position of the bottom line of a page has benefits from design perspective.
+      Keeping the position of the bottom line of a page has benefits for
+      design and readability.
       This also results better readability on duplex printing,
       two pages spreads,
       or when displaying on slow display devices like e-ink.</li>
-    <li>East Asian layouts require the use of grid layout
+    <li>East Asian layouts require the use of vertical rhythm
       more often than other scripts does,
       even in single column, non-paged media documents,
       as defined in [[JLREQ]].</li>
+    <li>In East Asian documents,
+      it is often desirable to make the line width to be multiple of <em>em</em>.
+      Since most East Asian characters have 1em advance,
+      and since most East Asian documents are justified,
+      this minimizes the case where justification needs to expand lines.</li>
   </ul>
 
   <p>There are several types of objects in a document
@@ -166,7 +169,7 @@
   
 <h2>Defining Grids</h2>
 
-<h3 id="H1">Define Line Grids: the 'layout-grid-line' property</h3>
+<h3 id="layout-grid-line-prop">Define Line Grids: the 'layout-grid-line' property</h3>
 
   <table class=propdef>
     <tr>
@@ -197,7 +200,12 @@
       <td>specified value
   </table>
 
-  <p class="issue">TBD</p>
+  <p class="issue">TBD:
+    I expect this to be very similar to the one in
+    <a href="http://www.w3.org/TR/2001/WD-css3-text-20010517/#layout-grid-line-prop">CSS3 module: text WD 20010517</a>.</p>
+  <p class="issue">Grid origin should be defined by the element that has this property,
+    similar to ''display: static''.
+    In that case, should this property inherit, or not inherit the property but inherit grid?</p>
 
 
 <h2>Using Grids</h2>
@@ -294,30 +302,32 @@
     line grids must be defined by the 'layout-grid-line' property.</p>
 
    <div class="example">
-    <p>When a different size of text like headings wraps,
-      it is usually aligned to grids as a block and
-      lines within the block do not align.</p>
-
-    <div class="figure">
+    <div class="sidefigure">
       <img src="line-grid-wrap.png"
         width="276" height="244"
-        alt="A line of large text wraps within line grids"
+        alt="Large text wraps within line grids"
         />
-      <p class="caption">A line of large text wraps within line grids.</p>
+      <p class="caption">Large text wraps within line grids.</p>
     </div>
 
+    <p>When a different size of text like headings wraps,
+      it is usually aligned to grids as a block and
+      lines within the block do not align.</p>
+
     <p>This effect can be achieved by the following code:</p>
     <pre><code class="css">
 <!-- -->body { line-grid-mode: line; }
 <!-- -->h1 { line-grid-mode: block; }
 <!-- --></code></pre>
+
+    <br style="clear:both;"/>
    </div>
 
 <h3>Grid Shorthand: the 'layout-grid' property</h3>
 
   <p class="issue">TBD</p>
 
-<h3>The ''<span class="index" title="length unit::gd">gd</span>'' length unit</h3>
+<h3 id="grid-length-unit">The ''<span class="index" title="length unit::gd">gd</span>'' length unit</h3>
 
   <p>The existence of a grid in an element makes it possible
     and very useful to express various measurements in that
@@ -335,7 +345,9 @@
  
   <p>If no grid is specified, the gd unit should be treated the same as the em unit.</p>
 
-<h3>Rounding Down to Multiple of Units:
+  <p class="issue">Just copied from old WD, need to refresh</p>
+
+<h3 id="round-length">Rounding Down to Multiple of Units:
   ''<span class="index" title="length unit::*gd">*gd</span>''
   and ''<span class="index" title="length unit::*em">*em</span>''</h3>
 
@@ -350,15 +362,7 @@
     If it is used for 'height', the half of fraction is added to the top and bottom margins,
     and if for 'width', to the left and right margins.</p>
 
-  <div class="example">
-    <pre><code class="css">
-<!-- -->body {
-<!-- -->  width: *em;
-<!-- -->  height: *gd;
-<!-- -->  margin: 3em 2gd 3em 3gd;
-<!-- -->}
-<!-- --></code></pre>
-  </div>
+  <p class="issue">Should this be a property instead?</p>
 
 <h2 id="conformance">
 Conformance</h2>
Received on Thursday, 28 April 2011 04:55:29 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Thursday, 28 April 2011 04:55:31 GMT