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

csswg/css-line-grid Overview.html,1.5,1.6 Overview.src.html,1.5,1.6

From: Ishii Koji via cvs-syncmail <cvsmail@w3.org>
Date: Fri, 29 Apr 2011 05:54:32 +0000
To: public-css-commits@w3.org
Message-Id: <E1QFgeu-0004tG-OT@lionel-hutz.w3.org>
Update of /sources/public/csswg/css-line-grid
In directory hutz:/tmp/cvs-serv18776

Modified Files:
	Overview.html Overview.src.html 
Log Message:
Add layout-grid-mode: baseline

Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css-line-grid/Overview.html,v
retrieving revision 1.5
retrieving revision 1.6
diff -u -d -r1.5 -r1.6
--- Overview.html	29 Apr 2011 05:37:38 -0000	1.5
+++ Overview.html	29 Apr 2011 05:54:30 -0000	1.6
@@ -418,7 +418,7 @@
     <tr>
      <th>Value:
 
-     <td>none | block | line
+     <td>none | baseline | block | line
 
     <tr>
      <th>Initial:
@@ -460,6 +460,17 @@
 
    <dd>Do not align any objects to the grids.
 
+   <dt><dfn id=baseline title="layout-grid-mode::baseline">&lsquo;<code
+    class=css>baseline</code>&rsquo;</dfn>
+
+   <dd>Align baselines to the line grids. <!--
+        The line in this definition is a line box
+        with before margin included if it is the first line of a block,
+        and with after margin if last.
+        -->
+    The height is the height of the line box. Increasing heights to fit to
+    grids is done by increasing the computed height of the line box.
+
    <dt><dfn id=block title="layout-grid-mode::block">&lsquo;<code
     class=css>block</code>&rsquo;</dfn>
 
@@ -484,12 +495,22 @@
   <p class=issue>Handling margins and borders needs review
 
   <p>When this property is set to anything other than &lsquo;<code
-   class=css>none</code>&rsquo;, the object to align is vertically centered
-   within the grid row. If the computed height is larger than the grid space,
-   then the object is centered within the smallest number of grid rows
-   necessary for the object to fit in. The starting alignment point is moved
-   accordingly. This is illustrated below, where <em>a</em> represents the
-   numerical &lsquo;<a href="#layout-grid-line"><code
+   class=css>none</code>&rsquo;, the computed height of the object is
+   increased to the smallest multiple of the grid heights that is equal to or
+   smaller than the original computed height.
+
+  <p>When the value of this property is &lsquo;<code
+   class=css>baseline</code>&rsquo;, the line box is then moved so that its
+   baseline is aligned to the next closest grid.
+
+  <p>When the value of this property is either &lsquo;<code
+   class=css>block</code>&rsquo; or &lsquo;<code
+   class=css>line</code>&rsquo;, the object is vertically centered within the
+   grid row. If the computed height is larger than the grid space, then the
+   object is centered within the smallest number of grid rows necessary for
+   the object to fit in. The starting alignment point is moved accordingly.
+   This is illustrated below, where <em>a</em> represents the numerical
+   &lsquo;<a href="#layout-grid-line"><code
    class=property>layout-grid-line</code></a>&rsquo; value, <em>b</em> and
    <em>c</em> are half the difference between the computed line-heights and
    either the layout-grid-line value or twice the value respectively.:
@@ -518,7 +539,8 @@
    baselines to grids rather than center of line boxes if we consider cases
    like only a word in a line is large. But how can we align baselines to
    grids? Align baselines to center of grids? Lines may not fit within one
-   grid.
+   grid. Align baselines to grids might work better, but it may not work well
+   with settings headigns to &lsquo;<code class=css>block</code>&rsquo;.
 
   <div class=example>
    <div class=sidefigure> <img alt="Large text wraps within line grids"
@@ -866,6 +888,9 @@
    <li>layout-grid-mode, <a href="#layout-grid-mode"
     title=layout-grid-mode><strong>3.1.</strong></a>
     <ul>
+     <li>baseline, <a href="#baseline" title="layout-grid-mode,
+      baseline"><strong>3.1.</strong></a>
+
      <li>block, <a href="#block" title="layout-grid-mode,
       block"><strong>3.1.</strong></a>
 
@@ -935,7 +960,7 @@
     <tr valign=baseline>
      <td><a class=property href="#layout-grid-mode">layout-grid-mode</a>
 
-     <td>none | block | line
+     <td>none | baseline | block | line
 
      <td>none
 

Index: Overview.src.html
===================================================================
RCS file: /sources/public/csswg/css-line-grid/Overview.src.html,v
retrieving revision 1.5
retrieving revision 1.6
diff -u -d -r1.5 -r1.6
--- Overview.src.html	29 Apr 2011 05:37:38 -0000	1.5
+++ Overview.src.html	29 Apr 2011 05:54:30 -0000	1.6
@@ -262,7 +262,7 @@
       <td><dfn>layout-grid-mode</dfn>
     <tr>
       <th>Value:
-      <td>none | block | line
+      <td>none | baseline | block | line
     <tr>
       <th>Initial:
       <td>none
@@ -289,6 +289,17 @@
   <dl>
     <dt><dfn title="layout-grid-mode::none">''none''</dfn></dt>
       <dd>Do not align any objects to the grids.</dd>
+    <dt><dfn title="layout-grid-mode::baseline">''baseline''</dfn></dt>
+      <dd>Align baselines to the line grids.
+        <!--
+        The line in this definition is a line box
+        with before margin included if it is the first line of a block,
+        and with after margin if last.
+        -->
+        The height is the height of the line box.
+        Increasing heights to fit to grids is done by
+        increasing the computed height of the line box.
+      </dd>
     <dt><dfn title="layout-grid-mode::block">''block''</dfn></dt>
       <dd>Align blocks to the line grids.
         <!--
@@ -313,7 +324,16 @@
   <p class="issue">Handling margins and borders needs review</p>
 
   <p>When this property is set to anything other than ''none'',
-    the object to align is vertically centered within the grid row.
+    the computed height of the object is increased to
+    the smallest multiple of the grid heights
+    that is equal to or smaller than the original computed height.</p>
+
+  <p>When the value of this property is ''baseline'',
+    the line box is then moved so that its baseline is aligned
+    to the next closest grid.</p>
+
+  <p>When the value of this property is either ''block'' or ''line'',
+    the object is vertically centered within the grid row.
     If the computed height is larger than the grid space,
     then the object is centered within the smallest number of grid rows
     necessary for the object to fit in.
@@ -349,7 +369,8 @@
     to align baselines to grids rather than center of line boxes
     if we consider cases like only a word in a line is large.
     But how can we align baselines to grids?
-    Align baselines to center of grids? Lines may not fit within one grid.</p>
+    Align baselines to center of grids? Lines may not fit within one grid.
+    Align baselines to grids might work better, but it may not work well with settings headigns to ''block''.</p>
 
   <div class="example">
     <div class="sidefigure">
Received on Friday, 29 April 2011 05:54:34 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Friday, 29 April 2011 05:54:35 GMT