- 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