- From: Elika Etemad via cvs-syncmail <cvsmail@w3.org>
- Date: Thu, 02 Jun 2011 15:20:28 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-writing-modes
In directory hutz:/tmp/cvs-serv25122
Modified Files:
Overview.html Overview.src.html
Log Message:
Confirm per WG resolution that inline elements should use parent element to determine start/end of box
Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css3-writing-modes/Overview.html,v
retrieving revision 1.149
retrieving revision 1.150
diff -u -d -r1.149 -r1.150
--- Overview.html 2 Jun 2011 02:06:52 -0000 1.149
+++ Overview.html 2 Jun 2011 15:20:26 -0000 1.150
@@ -906,7 +906,7 @@
class=css>horizontal-tb</code></a>’ writing mode:
<ul>
- <li>When the element's ‘<a href="#direction0"><code
+ <li>When theparent's ‘<a href="#direction0"><code
class=property>direction</code></a>’ property is ‘<a
href="#ltr"><code class=css>ltr</code></a>’, the left-most
generated box of the first line box in which the element appears has the
@@ -914,7 +914,7 @@
box of the last line box in which the element appears has the right
padding, right border and right margin.
- <li>When the element's ‘<a href="#direction0"><code
+ <li>When the parent's ‘<a href="#direction0"><code
class=property>direction</code></a>’ property is ‘<a
href="#rtl"><code class=css>rtl</code></a>’, the right-most
generated box of the first line box in which the element appears has the
@@ -925,10 +925,6 @@
<p>Analogous rules hold for vertical writing modes.
- <p class=issue>The box model here <a
- href="http://lists.w3.org/Archives/Public/www-style/2011May/0186.html">seems
- backwards</a> when the element breaks across lines...
-
<p class=note>The ‘<code
class=property>box-decoration-break</code>’ property can override
this behavior to draw box decorations on both sides of each box. <a
@@ -1469,12 +1465,11 @@
values are provided to specify rotation vs. translation of horizontal-only
text.
- <p class=note>The ‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’, ‘<a
- href="#rotate-right"><code class=css>rotate-right</code></a>’, and
- ‘<a href="#rotate-normal"><code
- class=css>rotate-normal</code></a>’ values of ‘<a
- href="#text-orientation0"><code
+ <p class=note>The ‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’, ‘<a
+ href="#sideways-right"><code class=css>sideways-right</code></a>’,
+ and ‘<a href="#sideways"><code class=css>sideways</code></a>’
+ values of ‘<a href="#text-orientation0"><code
class=property>text-orientation</code></a>’ are provided for
decorative layout effects and to work around limitations in CSS support
for bottom-to-top scripts.
@@ -1503,8 +1498,8 @@
<tr>
<th>Value:
- <td>vertical-right | upright | rotate-right | rotate-left |
- rotate-normal | auto
+ <td>vertical-right | upright | sideways-right | sideways-left | sideways
+ | auto
<tr>
<th>Initial:
@@ -1587,7 +1582,7 @@
<p>In vertical writing modes, this value puts the element in a
<i>vertical typographic mode</i>.
- <dt><dfn id=rotate-right>rotate-right</dfn>
+ <dt><dfn id=sideways-right>sideways-right</dfn>
<dd>
<p>In vertical writing modes, this causes text to be set as if in a
@@ -1595,7 +1590,7 @@
rotated 90° clockwise. This value puts the element in a
<i>horizontal typographic mode</i>.
- <dt><dfn id=rotate-left>rotate-left</dfn>
+ <dt><dfn id=sideways-left>sideways-left</dfn>
<dd>
<p>In vertical writing modes, this causes text to be set as if in a
@@ -1604,13 +1599,13 @@
<i>horizontal typographic mode</i>.
<p>If set on a non-replaced inline whose parent is not ‘<a
- href="#rotate-left"><code class=css>rotate-left</code></a>’, this
- forces ‘<a href="#isolate"><code
+ href="#sideways-left"><code class=css>sideways-left</code></a>’,
+ this forces ‘<a href="#isolate"><code
class=css>isolate</code></a>’ to be added to the computed value of
‘<a href="#unicode-bidi0"><code
class=property>unicode-bidi</code></a>’. Layout of text is exactly
- as for ‘<a href="#rotate-right"><code
- class=css>rotate-right</code></a>’ except that the text content
+ as for ‘<a href="#sideways-right"><code
+ class=css>sideways-right</code></a>’ except that the text content
and baseline table of each of the element's inline boxes is mirrored
around a vertical axis along the center of its content box. The
positions of text decorations propagated from an ancestor inline
@@ -1621,18 +1616,18 @@
<p>Similarly, if an inline child of the element has a ‘<a
href="#text-orientation0"><code
class=property>text-orientation</code></a>’ value other than
- ‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’, an analogous transformation is
- applied.
+ ‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’, an analogous transformation
+ is applied.
- <dt><dfn id=rotate-normal>rotate-normal</dfn>
+ <dt><dfn id=sideways>sideways</dfn>
<dd>
- <p>This value is equivalent to ‘<a href="#rotate-right"><code
- class=css>rotate-right</code></a>’ in ‘<a
+ <p>This value is equivalent to ‘<a href="#sideways-right"><code
+ class=css>sideways-right</code></a>’ in ‘<a
href="#vertical-rl"><code class=css>vertical-rl</code></a>’
- writing mode and equivalent to ‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’ in ‘<a
+ writing mode and equivalent to ‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’ in ‘<a
href="#vertical-lr"><code class=css>vertical-lr</code></a>’
writing mode. It can be useful when setting horizontal script text
vertically in a primarily horizontal-only document.
@@ -1663,24 +1658,24 @@
</dl>
<div class=figure> <img alt="text-orientation: vertical-right, upright,
- rotate-left, and rotate-right" height=114 src=text-orientation.png
+ sideways-left, and sideways-right" height=114 src=text-orientation.png
width=305>
- <p class=caption>text-orientation: vertical-right, upright, rotate-left,
- and rotate-right (writing-mode is vertical-rl)</p>
+ <p class=caption>text-orientation: vertical-right, upright, sideways-left,
+ and sideways-right (writing-mode is vertical-rl)</p>
</div>
<div class=example>
<p>In the following example, the root element of a horizontal-only
- document is set to use ‘<a href="#rotate-normal"><code
- class=css>rotate-normal</code></a>’. In the rest of the document,
- the author can just set ‘<a href="#writing-mode1"><code
+ document is set to use ‘<a href="#sideways"><code
+ class=css>sideways</code></a>’. In the rest of the document, the
+ author can just set ‘<a href="#writing-mode1"><code
class=property>writing-mode</code></a>’ without worrying about
whether the text is ‘<a href="#vertical-rl"><code
class=css>vertical-rl</code></a>’ or ‘<a
href="#vertical-lr"><code class=css>vertical-lr</code></a>’.
<pre>
- :root { text-orientation: rotate-normal; }
+ :root { text-orientation: sideways; }
caption { caption-side: left; writing-mode: vertical-lr; }
thead th { writing-mode: vertical-lr; }
h1.banner { position: absolute; top: 0; right: 0; writing-mode: vertical-rl; }
@@ -1855,9 +1850,9 @@
<div class=figure> <a href="diagrams/line-orient-left.svg"
type="image/svg+xml"> <img alt="Line orientation with ''text-orientation:
- rotate-left''" class=portrait src="diagrams/line-orient-left.png"></a>
+ sideways-left''" class=portrait src="diagrams/line-orient-left.png"></a>
<p class=caption>Line orientation with ‘<code
- class=css>text-orientation: rotate-left</code>’</p>
+ class=css>text-orientation: sideways-left</code>’</p>
</div>
</div>
@@ -1977,17 +1972,17 @@
<th colspan=2>—
- <th colspan=2>‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’
+ <th colspan=2>‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’
<th colspan=2><abbr title="vertical-right, upright,
- rotate-right">*right</abbr>
+ sideways-right">*right</abbr>
- <th colspan=2>‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’
+ <th colspan=2>‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’
<th colspan=2><abbr title="vertical-right, upright,
- rotate-right">*right</abbr>
+ sideways-right">*right</abbr>
<tr>
<th scope=row>‘<a href="#direction0"><code
@@ -3054,8 +3049,8 @@
it is a bottom-to-top script, for the purposes of this specification it is
treated as left-to-right horizontal. A future version of CSS may define
proper handling of bottom-to-top scripts. Authors can work around this
- lack of support with the ‘<a href="#rotate-left"><code
- class=css>rotate-left</code></a>’ value of ‘<a
+ lack of support with the ‘<a href="#sideways-left"><code
+ class=css>sideways-left</code></a>’ value of ‘<a
href="#text-orientation0"><code
class=property>text-orientation</code></a>’.
@@ -3715,8 +3710,8 @@
<tr>
<td><a class=property href="#text-orientation0">text-orientation</a>
- <td>vertical-right | upright | rotate-right | rotate-left |
- rotate-normal | auto
+ <td>vertical-right | upright | sideways-right | sideways-left | sideways
+ | auto
<td>vertical-right
Index: Overview.src.html
===================================================================
RCS file: /sources/public/csswg/css3-writing-modes/Overview.src.html,v
retrieving revision 1.157
retrieving revision 1.158
diff -u -d -r1.157 -r1.158
--- Overview.src.html 2 Jun 2011 15:17:38 -0000 1.157
+++ Overview.src.html 2 Jun 2011 15:20:26 -0000 1.158
@@ -586,12 +586,12 @@
element appears has the <i>end</i> edge's margin, border, and padding.
For example, in the ''horizontal-tb'' writing mode:
<ul>
- <li>When the element's 'direction' property is ''ltr'', the left-most
+ <li>When theparent's 'direction' property is ''ltr'', the left-most
generated box of the first line box in which the element appears
has the left margin, left border and left padding, and the right-most
generated box of the last line box in which the element appears has
the right padding, right border and right margin.
- <li>When the element's 'direction' property is ''rtl'', the right-most
+ <li>When the parent's 'direction' property is ''rtl'', the right-most
generated box of the first line box in which the element appears has
the right padding, right border and right margin, and the left-most
generated box of the last line box in which the element appears has
@@ -599,8 +599,6 @@
</ul>
<p>Analogous rules hold for vertical writing modes.</p>
- <p class="issue">The box model here <a href='http://lists.w3.org/Archives/Public/www-style/2011May/0186.html'>seems backwards</a> when the element breaks across lines...</p>
-
<p class="note">The 'box-decoration-break' property can override this
behavior to draw box decorations on both sides of each box. [[!CSS3BG]] </p>
Received on Thursday, 2 June 2011 15:20:32 UTC