mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update CSS tests to revision 7a87ef71fc579e52d3438e009107aa442bc4021b
This commit is contained in:
Ms2ger
parent
ad94ef5a96
commit
145aea3eeb
1196 changed files with 14344 additions and 6221 deletions
|
|
@ -1345,10 +1345,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-001-vlr-2.1" class="">
|
||||
<tr id="table-progression-vlr-001-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-001-vlr.xht">table-progression-001-vlr</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-001.xht">table-progression-vlr-001</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -1357,22 +1357,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-001-vrl-2.1" class="">
|
||||
<tr id="table-progression-vlr-002-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-001-vrl.xht">table-progression-001-vrl</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables order rows/rowgroups right to left and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'.</li>
|
||||
<li>This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-002-vlr-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-002-vlr.xht">table-progression-002-vlr</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-002.xht">table-progression-vlr-002</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -1381,10 +1369,44 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-002-vrl-2.1" class="">
|
||||
<tr id="table-progression-vlr-003-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-002-vrl.xht">table-progression-002-vrl</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-003.xht">table-progression-vlr-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vlr-004-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-vlr-004.xht">table-progression-vlr-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vrl-001-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-vrl-001.xht">table-progression-vrl-001</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables order rows/rowgroups right to left and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'.</li>
|
||||
<li>This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vrl-002-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-vrl-002.xht">table-progression-vrl-002</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -1393,21 +1415,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-003-vlr-2.1" class="">
|
||||
<tr id="table-progression-vrl-003-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-003-vlr.xht">table-progression-003-vlr</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-003-vrl-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-003-vrl.xht">table-progression-003-vrl</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-003.xht">table-progression-vrl-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -1415,21 +1426,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vlr-2.1" class="">
|
||||
<tr id="table-progression-vrl-004-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-004-vlr.xht">table-progression-004-vlr</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vrl-2.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-004-vrl.xht">table-progression-004-vrl</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-004.xht">table-progression-vrl-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
|
||||
<h2>Introduction to Vertical Text (90 tests)</h2>
|
||||
<h2>Introduction to Vertical Text (89 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -745,10 +745,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-001-vlr-3.1" class="primary">
|
||||
<tr id="table-progression-vlr-001-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-001-vlr.xht">table-progression-001-vlr</a></strong></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-001.xht">table-progression-vlr-001</a></strong></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -757,22 +757,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-001-vrl-3.1" class="primary">
|
||||
<tr id="table-progression-vlr-002-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-001-vrl.xht">table-progression-001-vrl</a></strong></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables order rows/rowgroups right to left and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'.</li>
|
||||
<li>This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-002-vlr-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-002-vlr.xht">table-progression-002-vlr</a></strong></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-002.xht">table-progression-vlr-002</a></strong></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -781,10 +769,44 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-002-vrl-3.1" class="primary">
|
||||
<tr id="table-progression-vlr-003-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-002-vrl.xht">table-progression-002-vrl</a></strong></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-003.xht">table-progression-vlr-003</a></strong></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vlr-004-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-vlr-004.xht">table-progression-vlr-004</a></strong></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vrl-001-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-vrl-001.xht">table-progression-vrl-001</a></strong></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables order rows/rowgroups right to left and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'.</li>
|
||||
<li>This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vrl-002-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-vrl-002.xht">table-progression-vrl-002</a></strong></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -793,21 +815,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-003-vlr-3.1" class="primary">
|
||||
<tr id="table-progression-vrl-003-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-003-vlr.xht">table-progression-003-vlr</a></strong></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-003-vrl-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-003-vrl.xht">table-progression-003-vrl</a></strong></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-003.xht">table-progression-vrl-003</a></strong></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -815,21 +826,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vlr-3.1" class="primary">
|
||||
<tr id="table-progression-vrl-004-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-004-vlr.xht">table-progression-004-vlr</a></strong></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-lr tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vrl-3.1" class="primary">
|
||||
<td><strong>
|
||||
<a href="table-progression-004-vrl.xht">table-progression-004-vrl</a></strong></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-004.xht">table-progression-vrl-004</a></strong></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -1015,7 +1015,7 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s3.1.1">+</a>
|
||||
<a href="http://www.w3.org/TR/css-writing-modes-3/#svg-writing-mode">3.1.1 SVG1.1 writing-mode Values</a></th></tr>
|
||||
<!-- 2 tests -->
|
||||
<!-- 1 tests -->
|
||||
<tr id="writing-mode-parsing-svg1-001-3.1.1" class="primary dom may svg script">
|
||||
<td><strong>
|
||||
<a href="writing-mode-parsing-svg1-001.xht">writing-mode-parsing-svg1-001</a></strong></td>
|
||||
|
|
@ -1027,17 +1027,6 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="writing-mode-parsing-svg1-002-3.1.1" class="primary dom may svg script">
|
||||
<td><strong>
|
||||
<a href="writing-mode-parsing-svg1-002.xht">writing-mode-parsing-svg1-002</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="may" title="Behavior tested is preferred but optional">Optional</abbr><abbr class="svg" title="Requires SVG support">SVG</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>CSS Writing Modes: parsing SVG 1.1 writing-mode values
|
||||
<ul class="assert">
|
||||
<li>This test asserts the parser and getComputedStyle works correctly for the SVG 1.1 writing-mode values.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s3.1.1.#inline-progression-direction">
|
||||
<!-- 0 tests -->
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
|
||||
<h2>Inline-level Alignment (31 tests)</h2>
|
||||
<h2>Inline-level Alignment (30 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -149,7 +149,7 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s4.3">+</a>
|
||||
<a href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines">4.3 Atomic Inline Baselines</a></th></tr>
|
||||
<!-- 23 tests -->
|
||||
<!-- 22 tests -->
|
||||
<tr id="baseline-inline-non-replaced-002-4.3" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="baseline-inline-non-replaced-002.xht">baseline-inline-non-replaced-002</a></strong></td>
|
||||
|
|
@ -282,17 +282,6 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="inline-block-alignment-008-4.3" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="inline-block-alignment-008.xht">inline-block-alignment-008</a></strong></td>
|
||||
<td><a href="reference/inline-block-alignment-006-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>inline block alignment - alphabetical alignment with vertical layout
|
||||
<ul class="assert">
|
||||
<li>This test checks the generation of inline-block baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="inline-block-alignment-orthogonal-vlr-003-4.3" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="inline-block-alignment-orthogonal-vlr-003.xht">inline-block-alignment-orthogonal-vlr-003</a></strong></td>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
|
||||
<h2>Introduction to Vertical Text Layout (29 tests)</h2>
|
||||
<h2>Introduction to Vertical Text Layout (28 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -55,11 +55,11 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s5.1">+</a>
|
||||
<a href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">5.1 Orienting Text: the text-orientation property</a></th></tr>
|
||||
<!-- 29 tests -->
|
||||
<tr id="table-progression-003-vlr-5.1" class="">
|
||||
<!-- 28 tests -->
|
||||
<tr id="table-progression-vlr-003-5.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-003-vlr.xht">table-progression-003-vlr</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-003.xht">table-progression-vlr-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -67,21 +67,10 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-003-vrl-5.1" class="">
|
||||
<tr id="table-progression-vlr-004-5.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-003-vrl.xht">table-progression-003-vrl</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vlr-5.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-004-vlr.xht">table-progression-004-vlr</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-004.xht">table-progression-vlr-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-lr upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -89,10 +78,21 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-004-vrl-5.1" class="">
|
||||
<tr id="table-progression-vrl-003-5.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-004-vrl.xht">table-progression-004-vrl</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-003.xht">table-progression-vrl-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering
|
||||
<ul class="assert">
|
||||
<li>This test checks that vertical-rl tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="table-progression-vrl-004-5.1" class="">
|
||||
<td>
|
||||
<a href="table-progression-vrl-004.xht">table-progression-vrl-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>vertical-rl upright orientation Table Column/Colgroup Ordering
|
||||
<ul class="assert">
|
||||
|
|
@ -122,17 +122,6 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-orientation-012-5.1" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="text-orientation-012.xht">text-orientation-012</a></strong></td>
|
||||
<td><a href="reference/text-orientation-012-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>text-orientation - sideways-right
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-orientation: sideways-right' causes text to be set as if in a horizontal layout, but rotated 90&deg; clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-orientation-014-5.1" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="text-orientation-014.xht">text-orientation-014</a></strong></td>
|
||||
|
|
@ -140,7 +129,7 @@
|
|||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>text-orientation - sideways
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-orientation: sideways' is equivalent to&#8216;sideways-right&#8217;in&#8216;vertical-rl&#8217;writing mode. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li>
|
||||
<li>This test checks that 'text-orientation: sideways' causes text to be set as if in a horizontal layout, but rotated 90&deg; clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -166,6 +155,17 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-orientation-parsing-sideways-right-001-5.1" class="primary dom may script">
|
||||
<td><strong>
|
||||
<a href="text-orientation-parsing-sideways-right-001.xht">text-orientation-parsing-sideways-right-001</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="may" title="Behavior tested is preferred but optional">Optional</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>CSS Writing Modes: parsing text-orientation
|
||||
<ul class="assert">
|
||||
<li>This test asserts the parser and getComputedStyle works correctly for the text-orientation property.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-orientation-script-001-5.1" class="primary combo dom font script">
|
||||
<td><strong>
|
||||
<a href="text-orientation-script-001.xht">text-orientation-script-001</a></strong></td>
|
||||
|
|
@ -349,18 +349,7 @@
|
|||
<td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>text-orientation - sideways in vertical-rl writing mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that the same as [text-orientation: sideways-right], general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-orientation-sideways-right-001-5.1" class="primary font image">
|
||||
<td><strong>
|
||||
<a href="text-orientation-sideways-right-001.xht">text-orientation-sideways-right-001</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>text-orientation - sideways-right in vertical-rl writing mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction.</li>
|
||||
<li>This test checks that general horizontal text (include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -349,69 +349,69 @@
|
|||
<a href="#s6.4">+</a>
|
||||
<a href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical">6.4 Abstract-to-Physical Mappings</a></th></tr>
|
||||
<!-- 12 tests -->
|
||||
<tr id="text-decoration-sidewaysright-vlr-003-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vlr-003-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vlr-003.xht">text-decoration-sidewaysright-vlr-003</a></td>
|
||||
<a href="text-decoration-sideways-vlr-003.xht">text-decoration-sideways-vlr-003</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vlr-005-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vlr-005-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vlr-005.xht">text-decoration-sidewaysright-vlr-005</a></td>
|
||||
<a href="text-decoration-sideways-vlr-005.xht">text-decoration-sideways-vlr-005</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vlr-007-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vlr-007-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vlr-007.xht">text-decoration-sidewaysright-vlr-007</a></td>
|
||||
<a href="text-decoration-sideways-vlr-007.xht">text-decoration-sideways-vlr-007</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-002-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vrl-002-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vrl-002.xht">text-decoration-sidewaysright-vrl-002</a></td>
|
||||
<a href="text-decoration-sideways-vrl-002.xht">text-decoration-sideways-vrl-002</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-004-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vrl-004-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vrl-004.xht">text-decoration-sidewaysright-vrl-004</a></td>
|
||||
<a href="text-decoration-sideways-vrl-004.xht">text-decoration-sideways-vrl-004</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-006-6.4" class="">
|
||||
<tr id="text-decoration-sideways-vrl-006-6.4" class="">
|
||||
<td>
|
||||
<a href="text-decoration-sidewaysright-vrl-006.xht">text-decoration-sidewaysright-vrl-006</a></td>
|
||||
<a href="text-decoration-sideways-vrl-006.xht">text-decoration-sideways-vrl-006</a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
<body>
|
||||
|
||||
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
|
||||
<h2>Abstract Box Layout (485 tests)</h2>
|
||||
<h2>Abstract Box Layout (494 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
|
|
@ -4681,70 +4681,70 @@
|
|||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s7.5">+</a>
|
||||
<a href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">7.5 Line-Relative Mappings</a></th></tr>
|
||||
<!-- 26 tests -->
|
||||
<tr id="text-decoration-sidewaysright-vlr-003-7.5" class="primary">
|
||||
<!-- 35 tests -->
|
||||
<tr id="text-decoration-sideways-vlr-003-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vlr-003.xht">text-decoration-sidewaysright-vlr-003</a></strong></td>
|
||||
<a href="text-decoration-sideways-vlr-003.xht">text-decoration-sideways-vlr-003</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vlr-005-7.5" class="primary">
|
||||
<tr id="text-decoration-sideways-vlr-005-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vlr-005.xht">text-decoration-sidewaysright-vlr-005</a></strong></td>
|
||||
<a href="text-decoration-sideways-vlr-005.xht">text-decoration-sideways-vlr-005</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vlr-007-7.5" class="primary">
|
||||
<tr id="text-decoration-sideways-vlr-007-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vlr-007.xht">text-decoration-sidewaysright-vlr-007</a></strong></td>
|
||||
<a href="text-decoration-sideways-vlr-007.xht">text-decoration-sideways-vlr-007</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-002-7.5" class="primary">
|
||||
<tr id="text-decoration-sideways-vrl-002-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vrl-002.xht">text-decoration-sidewaysright-vrl-002</a></strong></td>
|
||||
<a href="text-decoration-sideways-vrl-002.xht">text-decoration-sideways-vrl-002</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-004-7.5" class="primary">
|
||||
<tr id="text-decoration-sideways-vrl-004-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vrl-004.xht">text-decoration-sidewaysright-vrl-004</a></strong></td>
|
||||
<a href="text-decoration-sideways-vrl-004.xht">text-decoration-sideways-vrl-004</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="text-decoration-sidewaysright-vrl-006-7.5" class="primary">
|
||||
<tr id="text-decoration-sideways-vrl-006-7.5" class="primary">
|
||||
<td><strong>
|
||||
<a href="text-decoration-sidewaysright-vrl-006.xht">text-decoration-sidewaysright-vrl-006</a></strong></td>
|
||||
<a href="text-decoration-sideways-vrl-006.xht">text-decoration-sideways-vrl-006</a></strong></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode
|
||||
<td>'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode.</li>
|
||||
<li>This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -4968,6 +4968,105 @@
|
|||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-010-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-010.xht">vertical-alignment-vrl-010</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'mixed', 'vertical-align' is 'super', the baseline of the box is shifted to the right.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-012-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-012.xht">vertical-alignment-vrl-012</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'super', the baseline of the box is shifted to the right.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-014-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-014.xht">vertical-alignment-vrl-014</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways', 'vertical-align' is 'super', the baseline of the box is shifted to the right.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-016-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-016.xht">vertical-alignment-vrl-016</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'mixed', 'vertical-align' is 'sub', the baseline of the box is shifted to the left.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-018-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-018.xht">vertical-alignment-vrl-018</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'sub', the baseline of the box is shifted to the left.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-020-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-020.xht">vertical-alignment-vrl-020</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways', 'vertical-align' is 'sub', the baseline of the box is shifted to the left.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-022-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-022.xht">vertical-alignment-vrl-022</a></strong></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-022-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-024-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-024.xht">vertical-alignment-vrl-024</a></strong></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-022-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="vertical-alignment-vrl-026-7.5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="vertical-alignment-vrl-026.xht">vertical-alignment-vrl-026</a></strong></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-026-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>vertical-align - 'top' and vertical-rl writing-mode
|
||||
<ul class="assert">
|
||||
<li>This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways, 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s7.6">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 1.5em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 1.5em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 3em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 1.5em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 1.5em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 3em;
|
||||
line-height: 1.5em;
|
||||
|
||||
/* make sure UA that doesn't support writing mode and flexbox fails. */
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -23,14 +23,16 @@
|
|||
|
||||
<style type="text/css"><![CDATA[
|
||||
form
|
||||
{
|
||||
font-size: 1.25em;
|
||||
height: 13.5em;
|
||||
margin-left: 0.7em;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
{
|
||||
font-size: 18px;
|
||||
margin-left: 5em;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
select { vertical-align: top; }
|
||||
select
|
||||
{
|
||||
vertical-align: top;
|
||||
}
|
||||
]]></style>
|
||||
</head>
|
||||
|
||||
|
|
@ -39,7 +41,7 @@
|
|||
<form action="">
|
||||
<p><label>姓名 <input value="艾俐俐" size="10" /></label></p>
|
||||
|
||||
<p><label>语言 <select size="5"><option>English</option>
|
||||
<p><label>语言 <select size="1"><option>English</option>
|
||||
<option>français</option>
|
||||
<option>فارسی</option>
|
||||
<option>中文</option>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-20 -->
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-002-ref.xht" />
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-20 -->
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-003-ref.xht" />
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-20 -->
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-002-ref.xht" />
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-20 -->
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-003-ref.xht" />
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-21 -->
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-006-ref.xht" />
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
{
|
||||
color: fuchsia;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-006-ref.xht" />
|
||||
|
|
@ -22,7 +23,6 @@
|
|||
{
|
||||
color: fuchsia;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,70 +0,0 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: inline block alignment - alphabetical alignment with vertical layout</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test inline-block-alignment-008"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-21 -->
|
||||
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
|
||||
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
|
||||
<link rel="match" href="reference/inline-block-alignment-006-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of inline-block baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-sideways-right
|
||||
{
|
||||
color: fuchsia;
|
||||
font: 60px/1 Ahem; /* computes to 60px/60px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: sideways-right;
|
||||
}
|
||||
|
||||
div#inline-block
|
||||
{
|
||||
display: inline-block;
|
||||
padding-left: 0.5em; /* computes to 60px */
|
||||
font-size: 2em; /* computes to 120px */
|
||||
/*
|
||||
such padding-left declaration is arbitrary and only serve to make the
|
||||
test a bit more challenging.
|
||||
*/
|
||||
}
|
||||
|
||||
span.block-descendant
|
||||
{
|
||||
display: block;
|
||||
}
|
||||
|
||||
span#fuchsia30
|
||||
{
|
||||
padding-right: 4em; /* computes to 120px */
|
||||
font-size: 0.5em; /* computes to 30px */
|
||||
/*
|
||||
such padding-right declaration is arbitrary and only serve to make the
|
||||
test a bit more challenging.
|
||||
*/
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>left edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div id="rl-sideways-right">É<div id="inline-block">
|
||||
<span class="block-descendant">B</span>
|
||||
<span class="block-descendant last-line-box">É</span>
|
||||
</div><span id="fuchsia30">É</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
background: green;
|
||||
height: 3em;
|
||||
width: 3em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -3,7 +3,8 @@ CSS Orientation Test
|
|||
|
||||
Overview
|
||||
----
|
||||
CSS Orientation Test are special-purpose OpenType fonts. This open source project provides all of the source files that were used to build these OpenType fonts by using the AFDKO *makeotf* tool.
|
||||
CSS Orientation Test are special-purpose OpenType fonts. This open source project provides all of the source files
|
||||
that were used to build these OpenType fonts by using the AFDKO *makeotf* tool.
|
||||
|
||||
Getting Involved
|
||||
----
|
||||
|
|
@ -14,20 +15,26 @@ Building
|
|||
|
||||
Pre-built font binaries
|
||||
----
|
||||
The installable font resources (font binaries) are not part of the source files. They are available on [Open@Adobe](https://sourceforge.net/projects/csso9ntestfonts.adobe/files/).
|
||||
The installable font resources (font binaries) are not part of the source files.
|
||||
They are available at https://github.com/adobe-fonts/css-orientation-test/
|
||||
The latest version of the font binaries is 1.005 (October 2015).
|
||||
|
||||
|
||||
Requirements
|
||||
----
|
||||
|
||||
For building binary font files from source, installation of the [Adobe Font Development Kit for OpenType](http://www.adobe.com/devnet/opentype/afdko.html) (AFDKO) is necessary. The AFDKO tools are widely used for font development today, and are part of most font editor applications.
|
||||
For building binary font files from source, installation of the
|
||||
[Adobe Font Development Kit for OpenType](http://www.adobe.com/devnet/opentype/afdko.html) (AFDKO)
|
||||
is necessary. The AFDKO tools are widely used for font development today, and are part of most font editor applications.
|
||||
|
||||
Building the fonts
|
||||
----
|
||||
|
||||
The key to building OpenType fonts is *makeotf*, which is part of AFDKO. Information and usage instructions can be found by executing *makeotf -h*.
|
||||
The key to building OpenType fonts is *makeotf*, which is part of AFDKO. Information and usage instructions can be found
|
||||
by executing *makeotf -h*.
|
||||
|
||||
In this repository, all necessary files are in place for building the OpenType fonts. For example, build a binary OTF font for the full-width version like this, which also includes a post-process for inserting a "stub" 'DSIG' table:
|
||||
In this repository, all necessary files are in place for building the OpenType fonts. For example, build a binary OTF font
|
||||
for the full-width version like this, which also includes a post-process for inserting a "stub" 'DSIG' table:
|
||||
|
||||
% makeotf -f cidfont.ps -r -ch UnicodeAll-UTF32-H
|
||||
% sfntedit -a DSIG=DSIG.bin CSSFWOrientationTest.otf
|
||||
|
|
|
|||
|
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Reference</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
|
||||
<style>
|
||||
table {
|
||||
border-spacing: 0;
|
||||
margin: 1em;
|
||||
}
|
||||
td {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
border: solid gray;
|
||||
}
|
||||
|
||||
.navy { background: navy}
|
||||
.blue { background: blue }
|
||||
.aqua { background: aqua }
|
||||
.teal { background: teal }
|
||||
.purp { background: purple }
|
||||
.pink { background: fuchsia }
|
||||
.yllw { background: yellow }
|
||||
.orng { background: orange }
|
||||
caption { background: green; }
|
||||
</style>
|
||||
|
||||
</head><body><p>Test passes if the following three tables look identical.
|
||||
|
||||
</p><table>
|
||||
<caption></caption>
|
||||
<tbody><tr>
|
||||
<td rowspan="2">
|
||||
</td><td class="orng">
|
||||
</td><td colspan="3">
|
||||
</td><td class="navy">
|
||||
</td></tr><tr>
|
||||
<td rowspan="3">
|
||||
</td><td class="yllw">
|
||||
</td><td class="pink">
|
||||
</td><td rowspan="2">
|
||||
</td><td class="blue">
|
||||
</td></tr><tr>
|
||||
<td class="aqua">
|
||||
</td><td colspan="2" rowspan="2">
|
||||
</td><td rowspan="2">
|
||||
</td></tr><tr>
|
||||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
<table>
|
||||
<tbody><tr>
|
||||
<td rowspan="2">
|
||||
</td><td class="orng">
|
||||
</td><td colspan="3">
|
||||
</td><td class="navy">
|
||||
</td></tr><tr>
|
||||
<td rowspan="3">
|
||||
</td><td class="yllw">
|
||||
</td><td class="pink">
|
||||
</td><td rowspan="2">
|
||||
</td><td class="blue">
|
||||
</td></tr><tr>
|
||||
<td class="aqua">
|
||||
</td><td colspan="2" rowspan="2">
|
||||
</td><td rowspan="2">
|
||||
</td></tr><tr>
|
||||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
<table>
|
||||
<tbody><tr>
|
||||
<td rowspan="2">
|
||||
</td><td class="orng">
|
||||
</td><td colspan="3">
|
||||
</td><td class="navy">
|
||||
</td></tr><tr>
|
||||
<td rowspan="3">
|
||||
</td><td class="yllw">
|
||||
</td><td class="pink">
|
||||
</td><td rowspan="2">
|
||||
</td><td class="blue">
|
||||
</td></tr><tr>
|
||||
<td class="aqua">
|
||||
</td><td colspan="2" rowspan="2">
|
||||
</td><td rowspan="2">
|
||||
</td></tr><tr>
|
||||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Reference</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
|
||||
<style>
|
||||
table {
|
||||
border-spacing: 0;
|
||||
border: solid gray;
|
||||
margin: 1em;
|
||||
float: left;
|
||||
}
|
||||
td {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.navy { background: navy}
|
||||
.blue { background: blue }
|
||||
.aqua { background: aqua }
|
||||
.teal { background: teal }
|
||||
</style>
|
||||
|
||||
</head><body><p>Test passes if the following patterned boxes all look identical.
|
||||
|
||||
</p><table class="reference">
|
||||
<tbody><tr><td class="navy">
|
||||
</td></tr><tr><td class="navy">
|
||||
</td></tr><tr><td class="blue">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
<table class="reference">
|
||||
<tbody><tr><td class="navy">
|
||||
</td></tr><tr><td class="navy">
|
||||
</td></tr><tr><td class="blue">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
|
||||
<table class="reference">
|
||||
<tbody><tr><td class="navy">
|
||||
</td></tr><tr><td class="navy">
|
||||
</td></tr><tr><td class="blue">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
|
||||
<table class="reference">
|
||||
<tbody><tr><td class="navy">
|
||||
</td></tr><tr><td class="navy">
|
||||
</td></tr><tr><td class="blue">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
|
||||
<table class="reference">
|
||||
<tbody><tr><td class="navy">
|
||||
</td></tr><tr><td class="navy">
|
||||
</td></tr><tr><td class="blue">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-orientation-012-ref"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<!-- reftest for text-orientation-012.xht -->
|
||||
<link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/>
|
||||
<meta http-equiv="content-language" content="en"/>
|
||||
<style type="text/css">
|
||||
.view_ahem
|
||||
{
|
||||
background: pink;
|
||||
border: 1px solid black;
|
||||
color: blue;
|
||||
font: 20px/1 "Ahem";
|
||||
height: 3em;
|
||||
margin: 10px;
|
||||
width: 3em;
|
||||
white-space: pre;
|
||||
}
|
||||
.control_ahem
|
||||
{
|
||||
writing-mode: horizontal-tb;
|
||||
}
|
||||
.view
|
||||
{
|
||||
border: 1px solid gray;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 10px;
|
||||
width: 3em;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
.control
|
||||
{
|
||||
text-combine-upright: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body lang="en">
|
||||
<p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p>
|
||||
<div class="view_ahem"><span class="control_ahem">7 1
|
||||
52
|
||||
63</span></div>
|
||||
<div class="view_ahem"><span class="control_ahem">7 1
|
||||
52
|
||||
63</span></div>
|
||||
<hr/>
|
||||
<div class="view"><span class="control">123Abc<br/>def456</span></div>
|
||||
<div class="view"><span class="control">123Abc<br/>def456</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Reftest Reference</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-022-ref"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<meta name="flags" content="image" />
|
||||
<style type="text/css"><![CDATA[
|
||||
img
|
||||
{
|
||||
padding-left: 60px;
|
||||
vertical-align: top;
|
||||
}
|
||||
img + br + img
|
||||
{
|
||||
padding-left: 108px; /* 60 px (padding-left) + 48 px (the position of small blue box)*/
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div>
|
||||
<img class="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled" /><br /><img class="blue" src="support/swatch-blue.png" width="12" height="12" alt="Image download support must be enabled" />
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Reftest Reference</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-026-ref"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<meta name="flags" content="image" />
|
||||
<style type="text/css"><![CDATA[
|
||||
img
|
||||
{
|
||||
padding-left: 60px;
|
||||
vertical-align: top;
|
||||
}
|
||||
img + br + img
|
||||
{
|
||||
padding-left: 72px; /* 60 px (padding-left) + 12 px (the position of small blue box)*/
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div>
|
||||
<img class="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled" /><br /><img class="blue" src="support/swatch-blue.png" width="48" height="48" alt="Image download support must be enabled" />
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -4432,14 +4432,6 @@
|
|||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="inline-block-alignment-008" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="inline block alignment - alphabetical alignment with vertical layout">
|
||||
<a href="inline-block-alignment-008.xht">inline-block-alignment-008</a></td>
|
||||
<td><a href="reference/inline-block-alignment-006-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="inline-block-alignment-orthogonal-vlr-003" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="text baseline alignment of inline-block in orthogonal flow">
|
||||
|
|
@ -5056,67 +5048,67 @@
|
|||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-001-vlr" class="">
|
||||
<tbody id="table-progression-vlr-001" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-lr Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-001-vlr.xht">table-progression-001-vlr</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-001.xht">table-progression-vlr-001</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-001-vrl" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-001-vrl.xht">table-progression-001-vrl</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-002-vlr" class="">
|
||||
<tbody id="table-progression-vlr-002" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-lr Table Column/Colgroup Ordering">
|
||||
<a href="table-progression-002-vlr.xht">table-progression-002-vlr</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-002.xht">table-progression-vlr-002</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-002-vrl" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl Table Column/Colgroup Ordering">
|
||||
<a href="table-progression-002-vrl.xht">table-progression-002-vrl</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-003-vlr" class="">
|
||||
<tbody id="table-progression-vlr-003" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-003-vlr.xht">table-progression-003-vlr</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-003.xht">table-progression-vlr-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-003-vrl" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-003-vrl.xht">table-progression-003-vrl</a></td>
|
||||
<td><a href="table-progression-001-ref.orngtml">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-004-vlr" class="">
|
||||
<tbody id="table-progression-vlr-004" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-lr upright orientation Table Column/Colgroup Ordering">
|
||||
<a href="table-progression-004-vlr.xht">table-progression-004-vlr</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vlr-004.xht">table-progression-vlr-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-004-vrl" class="">
|
||||
<tbody id="table-progression-vrl-001" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-vrl-001.xht">table-progression-vrl-001</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-vrl-002" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl Table Column/Colgroup Ordering">
|
||||
<a href="table-progression-vrl-002.xht">table-progression-vrl-002</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-vrl-003" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering">
|
||||
<a href="table-progression-vrl-003.xht">table-progression-vrl-003</a></td>
|
||||
<td><a href="reference/table-progression-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="table-progression-vrl-004" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-rl upright orientation Table Column/Colgroup Ordering">
|
||||
<a href="table-progression-004-vrl.xht">table-progression-004-vrl</a></td>
|
||||
<td><a href="table-progression-002-ref.orngtml">=</a> </td>
|
||||
<a href="table-progression-vrl-004.xht">table-progression-vrl-004</a></td>
|
||||
<td><a href="reference/table-progression-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
|
@ -5584,14 +5576,6 @@
|
|||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="text-orientation-012" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="text-orientation - sideways-right">
|
||||
<a href="text-orientation-012.xht">text-orientation-012</a></td>
|
||||
<td><a href="reference/text-orientation-012-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="text-orientation-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="text-orientation - sideways">
|
||||
|
|
@ -5800,6 +5784,30 @@
|
|||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="vertical-alignment-vrl-022" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-align - 'top' and vertical-rl writing-mode">
|
||||
<a href="vertical-alignment-vrl-022.xht">vertical-alignment-vrl-022</a></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-022-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="vertical-alignment-vrl-024" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-align - 'top' and vertical-rl writing-mode">
|
||||
<a href="vertical-alignment-vrl-024.xht">vertical-alignment-vrl-024</a></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-022-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="vertical-alignment-vrl-026" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="vertical-align - 'top' and vertical-rl writing-mode">
|
||||
<a href="vertical-alignment-vrl-026.xht">vertical-alignment-vrl-026</a></td>
|
||||
<td><a href="reference/vertical-alignment-vrl-026-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="writing-mode-horizontal-001l" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="CSS Writing Modes: text-combine-upright in horizontal writing mode">
|
||||
|
|
|
|||
|
|
@ -550,7 +550,6 @@ inline-block-alignment-004.xht == reference/inline-block-alignment-002-ref.xht
|
|||
inline-block-alignment-005.xht == reference/inline-block-alignment-003-ref.xht
|
||||
inline-block-alignment-006.xht == reference/inline-block-alignment-006-ref.xht
|
||||
inline-block-alignment-007.xht == reference/inline-block-alignment-006-ref.xht
|
||||
inline-block-alignment-008.xht == reference/inline-block-alignment-006-ref.xht
|
||||
inline-block-alignment-orthogonal-vlr-003.xht == reference/inline-block-alignment-orthogonal-vrl-002-ref.xht
|
||||
inline-block-alignment-orthogonal-vlr-005.xht == reference/inline-block-alignment-orthogonal-vrl-002-ref.xht
|
||||
inline-block-alignment-orthogonal-vrl-002.xht == reference/inline-block-alignment-orthogonal-vrl-002-ref.xht
|
||||
|
|
@ -628,14 +627,14 @@ table-column-order-002.xht == reference/block-flow-direction-001-ref.xht
|
|||
table-column-order-003.xht == reference/block-flow-direction-001-ref.xht
|
||||
table-column-order-004.xht == reference/block-flow-direction-001-ref.xht
|
||||
table-column-order-005.xht == reference/block-flow-direction-001-ref.xht
|
||||
table-progression-001-vlr.xht == table-progression-001-ref.orngtml
|
||||
table-progression-001-vrl.xht == table-progression-001-ref.orngtml
|
||||
table-progression-002-vlr.xht == table-progression-002-ref.orngtml
|
||||
table-progression-002-vrl.xht == table-progression-002-ref.orngtml
|
||||
table-progression-003-vlr.xht == table-progression-001-ref.orngtml
|
||||
table-progression-003-vrl.xht == table-progression-001-ref.orngtml
|
||||
table-progression-004-vlr.xht == table-progression-002-ref.orngtml
|
||||
table-progression-004-vrl.xht == table-progression-002-ref.orngtml
|
||||
table-progression-vlr-001.xht == reference/table-progression-001-ref.xht
|
||||
table-progression-vlr-002.xht == reference/table-progression-002-ref.xht
|
||||
table-progression-vlr-003.xht == reference/table-progression-001-ref.xht
|
||||
table-progression-vlr-004.xht == reference/table-progression-002-ref.xht
|
||||
table-progression-vrl-001.xht == reference/table-progression-001-ref.xht
|
||||
table-progression-vrl-002.xht == reference/table-progression-002-ref.xht
|
||||
table-progression-vrl-003.xht == reference/table-progression-001-ref.xht
|
||||
table-progression-vrl-004.xht == reference/table-progression-002-ref.xht
|
||||
text-align-vlr-003.xht == reference/ref-filled-green-100px-square.xht
|
||||
text-align-vlr-005.xht == reference/ref-filled-green-100px-square.xht
|
||||
text-align-vlr-007.xht == reference/ref-filled-green-100px-square.xht
|
||||
|
|
@ -694,7 +693,6 @@ text-indent-vrl-010.xht == reference/text-indent-vrl-010-ref.xht
|
|||
text-indent-vrl-012.xht == reference/text-indent-vrl-012-ref.xht
|
||||
text-indent-vrl-014.xht == reference/text-indent-vrl-010-ref.xht
|
||||
text-indent-vrl-016.xht == reference/text-indent-vrl-012-ref.xht
|
||||
text-orientation-012.xht == reference/text-orientation-012-ref.xht
|
||||
text-orientation-014.xht == reference/text-orientation-014-ref.xht
|
||||
unicode-bidi-001.xht == reference/direction-002-ref.xht
|
||||
unicode-bidi-002.xht == reference/unicode-bidi-002-ref.xht
|
||||
|
|
@ -721,6 +719,9 @@ vertical-alignment-006.xht == reference/vertical-alignment-006-ref.xht
|
|||
vertical-alignment-007.xht == reference/vertical-alignment-006-ref.xht
|
||||
vertical-alignment-008.xht == reference/vertical-alignment-008-ref.xht
|
||||
vertical-alignment-009.xht == reference/vertical-alignment-008-ref.xht
|
||||
vertical-alignment-vrl-022.xht == reference/vertical-alignment-vrl-022-ref.xht
|
||||
vertical-alignment-vrl-024.xht == reference/vertical-alignment-vrl-022-ref.xht
|
||||
vertical-alignment-vrl-026.xht == reference/vertical-alignment-vrl-026-ref.xht
|
||||
writing-mode-horizontal-001l.xht == reference/writing-mode-horizontal-001l-ref.xht
|
||||
writing-mode-horizontal-001r.xht == reference/writing-mode-horizontal-001r-ref.xht
|
||||
writing-mode-stretch-001.xht == reference/writing-mode-stretch-001-ref.xht
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -3,7 +3,8 @@ CSS Orientation Test
|
|||
|
||||
Overview
|
||||
----
|
||||
CSS Orientation Test are special-purpose OpenType fonts. This open source project provides all of the source files that were used to build these OpenType fonts by using the AFDKO *makeotf* tool.
|
||||
CSS Orientation Test are special-purpose OpenType fonts. This open source project provides all of the source files
|
||||
that were used to build these OpenType fonts by using the AFDKO *makeotf* tool.
|
||||
|
||||
Getting Involved
|
||||
----
|
||||
|
|
@ -14,20 +15,26 @@ Building
|
|||
|
||||
Pre-built font binaries
|
||||
----
|
||||
The installable font resources (font binaries) are not part of the source files. They are available on [Open@Adobe](https://sourceforge.net/projects/csso9ntestfonts.adobe/files/).
|
||||
The installable font resources (font binaries) are not part of the source files.
|
||||
They are available at https://github.com/adobe-fonts/css-orientation-test/
|
||||
The latest version of the font binaries is 1.005 (October 2015).
|
||||
|
||||
|
||||
Requirements
|
||||
----
|
||||
|
||||
For building binary font files from source, installation of the [Adobe Font Development Kit for OpenType](http://www.adobe.com/devnet/opentype/afdko.html) (AFDKO) is necessary. The AFDKO tools are widely used for font development today, and are part of most font editor applications.
|
||||
For building binary font files from source, installation of the
|
||||
[Adobe Font Development Kit for OpenType](http://www.adobe.com/devnet/opentype/afdko.html) (AFDKO)
|
||||
is necessary. The AFDKO tools are widely used for font development today, and are part of most font editor applications.
|
||||
|
||||
Building the fonts
|
||||
----
|
||||
|
||||
The key to building OpenType fonts is *makeotf*, which is part of AFDKO. Information and usage instructions can be found by executing *makeotf -h*.
|
||||
The key to building OpenType fonts is *makeotf*, which is part of AFDKO. Information and usage instructions can be found
|
||||
by executing *makeotf -h*.
|
||||
|
||||
In this repository, all necessary files are in place for building the OpenType fonts. For example, build a binary OTF font for the full-width version like this, which also includes a post-process for inserting a "stub" 'DSIG' table:
|
||||
In this repository, all necessary files are in place for building the OpenType fonts. For example, build a binary OTF font
|
||||
for the full-width version like this, which also includes a post-process for inserting a "stub" 'DSIG' table:
|
||||
|
||||
% makeotf -f cidfont.ps -r -ch UnicodeAll-UTF32-H
|
||||
% sfntedit -a DSIG=DSIG.bin CSSFWOrientationTest.otf
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-lr Table Row/Rowgroup/Cell Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-001-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-001-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-lr tables order rows/rowgroups left to right and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'." name="assert" />
|
||||
<meta content="This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
|
|
@ -59,7 +59,7 @@
|
|||
</p><table class="test">
|
||||
<thead>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></thead><tfoot>
|
||||
|
|
@ -88,7 +88,7 @@
|
|||
<tr>
|
||||
<td class="teal">
|
||||
</td><td class="aqua">
|
||||
</td><td colspan="2">
|
||||
</td><td colspan="2">
|
||||
</td></tr></thead><tfoot>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
|
|
@ -132,5 +132,4 @@
|
|||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-lr Table Column/Colgroup Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-002-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-002-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-lr tables order columns top-to-bottom (LTR) or bottom-to-top (RTL) per the table's 'direction'." name="assert" />
|
||||
<meta content="This test checks that 'writing-mode' and 'direction' do not apply to table columns and column groups." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
|
|
@ -84,5 +84,4 @@
|
|||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-lr upright orientation Table Row/Rowgroup/Cell Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-001-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-001-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-lr tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#direction" rel="help" />
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
</p><table class="test">
|
||||
<thead>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></thead><tfoot>
|
||||
|
|
@ -68,7 +68,7 @@
|
|||
<table class="test">
|
||||
<thead>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></thead><tfoot>
|
||||
|
|
@ -112,5 +112,4 @@
|
|||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-lr upright orientation Table Column/Colgroup Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-002-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-002-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-lr tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#direction" rel="help" />
|
||||
|
|
@ -73,5 +73,4 @@
|
|||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-rl Table Row/Rowgroup/Cell Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-001-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-001-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-rl tables order rows/rowgroups right to left and cells top-to-bottom (LTR) or bottom-to-top (RTL) per 'direction'." name="assert" />
|
||||
<meta content="This test checks that 'writing-mode' and 'direction' do not apply to table rows and row groups." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
|
|
@ -63,7 +63,7 @@
|
|||
</td><td colspan="2">
|
||||
</td></tr></thead><tfoot>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></tfoot><tbody>
|
||||
|
|
@ -92,7 +92,7 @@
|
|||
<tr>
|
||||
<td class="teal">
|
||||
</td><td class="aqua">
|
||||
</td><td colspan="2">
|
||||
</td><td colspan="2">
|
||||
</td></tr></tfoot><tbody>
|
||||
<tr>
|
||||
<td class="purp">
|
||||
|
|
@ -129,5 +129,4 @@
|
|||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-rl Table Column/Colgroup Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-002-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-002-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-rl tables order columns top-to-bottom (LTR) or bottom-to-top (RTL) per the table's 'direction'." name="assert" />
|
||||
<meta content="This test checks that 'writing-mode' and 'direction' do not apply to table columns and column groups." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
|
|
@ -83,5 +83,4 @@
|
|||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-rl upright orientation Table Row/Rowgroup/Cell Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-001-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-001-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-rl tables, whether LTR or RTL, order rows/rowgroups right to left and cells top-to-bottom when text-orientation is upright." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#direction" rel="help" />
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
</td><td colspan="2">
|
||||
</td></tr></thead><tfoot>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></tfoot><tbody>
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
</td><td colspan="2">
|
||||
</td></tr></thead><tfoot>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<td colspan="2">
|
||||
</td><td class="aqua">
|
||||
</td><td class="teal">
|
||||
</td></tr></tfoot><tbody>
|
||||
|
|
@ -112,5 +112,4 @@
|
|||
<td class="teal">
|
||||
</td><td class="purp">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Test: vertical-rl upright orientation Table Column/Colgroup Ordering</title>
|
||||
<link href="http://fantasai.inkedblade.net/contact" rel="author" title="Elika J. Etemad" />
|
||||
<link href="table-progression-002-ref.orngtml" rel="match" />
|
||||
<link href="reference/table-progression-002-ref.xht" rel="match" />
|
||||
<meta content="This test checks that vertical-rl tables, whether LTR or RTL, order columns top-to-bottom when text-orientation is upright." name="assert" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" />
|
||||
<link href="http://www.w3.org/TR/css-writing-modes-3/#direction" rel="help" />
|
||||
|
|
@ -72,5 +72,4 @@
|
|||
</td></tr><tr><td class="aqua">
|
||||
</td></tr><tr><td class="aqua">
|
||||
</td></tr></tbody></table>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-02-20 -->
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-002-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline." />
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-02-20 -->
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-002-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline." />
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-02-20 -->
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-002-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline." />
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-02-20 -->
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-002-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline." />
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
{
|
||||
color: orange;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-02-20 -->
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-006-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline." />
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
{
|
||||
color: fuchsia;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-26 -->
|
||||
<link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" />
|
||||
<link rel="match" href="reference/text-baseline-006-ref.xht" />
|
||||
<meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline." />
|
||||
|
|
@ -21,7 +22,6 @@
|
|||
{
|
||||
color: fuchsia;
|
||||
font: 60px/1.5 Ahem; /* computes to 60px/90px */
|
||||
height: 4em;
|
||||
writing-mode: vertical-lr;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vlr-003"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vlr-003"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: underline;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
|
||||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vlr-005"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vlr-005"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: overline;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
|
||||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-lr' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-lr' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vlr-007"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vlr-007"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-lr' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: line-through;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
|
||||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: underline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: underline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vrl-002"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vrl-002"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: underline' generates a line on the lefthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: underline;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: overline' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: overline' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vrl-004"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vrl-004"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: overline' generates a line on the righthand side of text when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: overline;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
|
|
@ -3,13 +3,13 @@
|
|||
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
|
||||
<title>CSS Writing Modes Test: 'text-decoration: line-through' and 'text-orientation: sideways-right' in a 'vertical-rl' writing-mode</title>
|
||||
<title>CSS Writing Modes Test: 'text-decoration: line-through' and 'text-orientation: sideways' in a 'vertical-rl' writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-decoration-sidewaysright-vrl-006"; }
|
||||
@top-right { content: "Test text-decoration-sideways-vrl-006"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical" title="6.4 Abstract-to-Physical Mappings" />
|
||||
|
||||
<meta name="flags" content="" />
|
||||
<meta content="This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways-right' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
<meta content="This test checks that 'text-decoration: line-through' generates a line that passes through the middle of glyphs when 'text-orientation' is set to 'sideways' in a 'vertical-rl' writing-mode." name="assert" />
|
||||
|
||||
<style type="text/css"><![CDATA[
|
||||
div
|
||||
|
|
@ -27,7 +27,7 @@
|
|||
color: blue;
|
||||
font: 2.5em/1.5 serif; /* computes to 40px/60px */
|
||||
text-decoration: line-through;
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>CSS Writing Modes Test: text-orientation - sideways-right</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-orientation-012"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/>
|
||||
<link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<link rel="match" href="reference/text-orientation-012-ref.xht"/>
|
||||
<meta http-equiv="content-language" content="en"/>
|
||||
<meta name="flags" content="ahem"/>
|
||||
<meta name="assert" content="This test checks that 'text-orientation: sideways-right' causes text to be set as if in a horizontal layout, but rotated 90° clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/>
|
||||
<style type="text/css">
|
||||
.view_ahem
|
||||
{
|
||||
background: pink;
|
||||
border: 1px solid black;
|
||||
color: blue;
|
||||
font: 20px/1 "Ahem";
|
||||
height: 3em;
|
||||
margin: 10px;
|
||||
width: 3em;
|
||||
white-space: pre;
|
||||
}
|
||||
#test_ahem
|
||||
{
|
||||
text-orientation: sideways-right; /* The property to be tested */
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
#control_ahem
|
||||
{
|
||||
writing-mode: horizontal-tb;
|
||||
}
|
||||
.view
|
||||
{
|
||||
border: 1px solid gray;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 10px;
|
||||
width: 3em;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
#test
|
||||
{
|
||||
text-orientation: sideways-right; /* The property to be tested */
|
||||
}
|
||||
#control
|
||||
{
|
||||
text-combine-upright: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body lang="en">
|
||||
<!--
|
||||
This test consists of a pair of sub-tests which complements each other.
|
||||
Logically, the test should verify 1.block flow direction, 2.inline direction
|
||||
and 3.glyph orientation. The "Ahem" sub-test comes first and checks 1. and 2. ,
|
||||
whereas "glyph" sub-test comes later and also checks 3.
|
||||
-->
|
||||
<p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p>
|
||||
<div class="view_ahem"><span id="test_ahem">123
|
||||
56
|
||||
7 </span></div>
|
||||
<div class="view_ahem"><span id="control_ahem">7 1
|
||||
52
|
||||
63</span></div>
|
||||
<hr/>
|
||||
<div class="view"><span id="test">123Abc<br/>def456</span></div>
|
||||
<div class="view"><span id="control">123Abc<br/>def456</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -12,11 +12,11 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/>
|
||||
<link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<link rel="help" title="5.1. Orienting Text: the 'text-orientation' property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<link rel="match" href="reference/text-orientation-014-ref.xht"/>
|
||||
<meta http-equiv="content-language" content="en"/>
|
||||
<meta name="flags" content="ahem"/>
|
||||
<meta name="assert" content="This test checks that 'text-orientation: sideways' is equivalent to‘sideways-right’in‘vertical-rl’writing mode. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/>
|
||||
<meta name="assert" content="This test checks that 'text-orientation: sideways' causes text to be set as if in a horizontal layout, but rotated 90° clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/>
|
||||
<style type="text/css">
|
||||
.view_ahem
|
||||
{
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@
|
|||
|
||||
<div data-expected="upright" style="text-orientation: upright"></div>
|
||||
<div data-expected="sideways" style="text-orientation: sideways"></div>
|
||||
<div data-expected="sideways-right" style="text-orientation: sideways-right"></div>
|
||||
|
||||
<div style="text-orientation: upright">
|
||||
<div data-expected="upright" title="text-orientation should inherit"></div>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,18 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Writing Modes: parsing SVG 1.1 writing-mode values</title>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head><title>CSS Writing Modes: parsing text-orientation</title>
|
||||
<link href="kojiishi@gmail.com" rel="author" title="Koji Ishii" />
|
||||
<link href="https://drafts.csswg.org/css-writing-modes-3/#svg-writing-mode" rel="help" />
|
||||
<meta content="This test asserts the parser and getComputedStyle works correctly for the SVG 1.1 writing-mode values." name="assert" />
|
||||
<meta content="dom svg may" name="flags" />
|
||||
<link href="https://drafts.csswg.org/css-writing-modes-3/#text-orientation" rel="help" />
|
||||
<meta content="This test asserts the parser and getComputedStyle works correctly for the text-orientation property." name="assert" />
|
||||
<meta content="dom may" name="flags" />
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
</head><body><div data-expected="lr-tb" style="writing-mode: lr-tb"></div>
|
||||
<div data-expected="rl-tb" style="writing-mode: rl-tb"></div>
|
||||
|
||||
<div data-expected="tb-rl" style="writing-mode: tb-rl"></div>
|
||||
</head><body><div data-expected="sideways" style="text-orientation: sideways-right"></div>
|
||||
|
||||
<script>
|
||||
Array.prototype.forEach.call(document.querySelectorAll("[data-expected]"), function (element) {
|
||||
test(function () {
|
||||
var actual = getComputedStyle(element).writingMode;
|
||||
var actual = getComputedStyle(element).textOrientation;
|
||||
assert_equals(actual, element.dataset.expected);
|
||||
}, element.title || element.getAttribute("style"));
|
||||
});
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
text-orientation: upright;
|
||||
}
|
||||
.R {
|
||||
text-orientation: sideways-right;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
#details {
|
||||
margin: 1em .5em;
|
||||
|
|
|
|||
|
|
@ -12,9 +12,9 @@
|
|||
}
|
||||
</style>
|
||||
<link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/>
|
||||
<link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<meta name="flags" content="font image"/>
|
||||
<meta name="assert" content="This test checks that the same as [text-orientation: sideways-right], general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction."/>
|
||||
<meta name="assert" content="This test checks that general horizontal text (include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction."/>
|
||||
<style type="text/css"><![CDATA[
|
||||
@font-face
|
||||
{
|
||||
|
|
|
|||
|
|
@ -1,59 +0,0 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>CSS Writing Modes Test: text-orientation - sideways-right in vertical-rl writing mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test text-orientation-sideways-right-001"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/>
|
||||
<link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/>
|
||||
<meta name="flags" content="font image"/>
|
||||
<meta name="assert" content="This test checks that general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction."/>
|
||||
<style type="text/css"><![CDATA[
|
||||
@font-face
|
||||
{
|
||||
font-family: "DejaVuSerifBook";
|
||||
src: url("support/DejaVuSerif-webfont.woff") format("woff");
|
||||
/* Filesize: 18096 bytes (17.7 KBytes) */
|
||||
}
|
||||
|
||||
div {
|
||||
border: 1px solid gray;
|
||||
float: left;
|
||||
color: blue;
|
||||
font-family: "DejaVuSerifBook";
|
||||
font-size: 30px;
|
||||
line-height: 1.4; /* equivalent to 42px:
|
||||
so that top-half-leading outside content is 6px
|
||||
and bottom-half-leading outside content is 6px */
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
div#vertical
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: sideways-right;
|
||||
}
|
||||
|
||||
img {vertical-align: top;}
|
||||
|
||||
]]></style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>Test passes if both "Text sample" rectangles
|
||||
have the same order, the same orientation and the same layout:
|
||||
"Text sample" should be displayed rotates 90 degrees clockwise.</p>
|
||||
|
||||
<div id="vertical">Ｔext sample</div>
|
||||
|
||||
<div><img src="./support/text-orientation-sideways-right-001.png" width="42" height="184" alt="Image download support must be enabled"/></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -32,17 +32,17 @@
|
|||
<tbody id="s3">
|
||||
<tr><th><a href="chapter-3.xht">Chapter 3 -
|
||||
Introduction to Vertical Text</a></th>
|
||||
<td>(90 Tests)</td></tr>
|
||||
<td>(89 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s4">
|
||||
<tr><th><a href="chapter-4.xht">Chapter 4 -
|
||||
Inline-level Alignment</a></th>
|
||||
<td>(31 Tests)</td></tr>
|
||||
<td>(30 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s5">
|
||||
<tr><th><a href="chapter-5.xht">Chapter 5 -
|
||||
Introduction to Vertical Text Layout</a></th>
|
||||
<td>(29 Tests)</td></tr>
|
||||
<td>(28 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s6">
|
||||
<tr><th><a href="chapter-6.xht">Chapter 6 -
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
<tbody id="s7">
|
||||
<tr><th><a href="chapter-7.xht">Chapter 7 -
|
||||
Abstract Box Layout</a></th>
|
||||
<td>(485 Tests)</td></tr>
|
||||
<td>(494 Tests)</td></tr>
|
||||
</tbody>
|
||||
<tbody id="s8">
|
||||
<tr><th><a href="chapter-8.xht">Chapter 8 -
|
||||
|
|
|
|||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-010"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'mixed', 'vertical-align' is 'super', the baseline of the box is shifted to the right." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-mixed
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: super;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are an orange rectangle on the left and a blue square on the right.</p>
|
||||
|
||||
<div id="rl-mixed">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-012"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'super', the baseline of the box is shifted to the right." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-upright
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: super;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are an orange rectangle on the left and a blue square on the right.</p>
|
||||
|
||||
<div id="rl-upright">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-014"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways', 'vertical-align' is 'super', the baseline of the box is shifted to the right." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-sideways
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: super;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are an orange rectangle on the left and a blue square on the right.</p>
|
||||
|
||||
<div id="rl-sideways">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-016"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'mixed', 'vertical-align' is 'sub', the baseline of the box is shifted to the left." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-mixed
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: sub;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are a blue square on the left and an orange rectangle on the right.</p>
|
||||
|
||||
<div id="rl-mixed">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-018"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'sub', the baseline of the box is shifted to the left." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-upright
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: sub;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are a blue square on the left and an orange rectangle on the right.</p>
|
||||
|
||||
<div id="rl-upright">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-020"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways', 'vertical-align' is 'sub', the baseline of the box is shifted to the left." />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-sideways
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: orange;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
vertical-align: sub;
|
||||
color: blue;
|
||||
margin-top: -1em;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if there are a blue square on the left and an orange rectangle on the right.</p>
|
||||
|
||||
<div id="rl-sideways">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-022"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent." />
|
||||
<link rel="match" href="reference/vertical-alignment-vrl-022-ref.xht" />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-upright
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: blue;
|
||||
text-orientation: upright;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
font-size: 0.2em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div id="rl-upright">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-024"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'upright', 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent." />
|
||||
<link rel="match" href="reference/vertical-alignment-vrl-022-ref.xht" />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-mixed
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: blue;
|
||||
text-orientation: mixed;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
font-size: 0.2em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div id="rl-mixed">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
|
||||
<style type="text/css">
|
||||
@page { font: italic 8pt sans-serif; color: gray;
|
||||
margin: 7%;
|
||||
counter-increment: page;
|
||||
@top-left { content: "CSS Writing Modes Module Level 3 CR Test Suite"; }
|
||||
@top-right { content: "Test vertical-alignment-vrl-026"; }
|
||||
@bottom-right { content: counter(page); }
|
||||
}
|
||||
</style>
|
||||
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
|
||||
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
|
||||
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
|
||||
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'text-orientation' is 'sideways, 'vertical-align' is 'middle', the vertical midpoint of the box is aligned with the central baseline of the parent box plus half the x-height of the parent." />
|
||||
<link rel="match" href="reference/vertical-alignment-vrl-026-ref.xht" />
|
||||
<meta name="flags" content="ahem" />
|
||||
<style type="text/css"><![CDATA[
|
||||
div#rl-sideways
|
||||
{
|
||||
writing-mode: vertical-rl;
|
||||
font: 60px/3 Ahem; /* computes to 60px/180px */
|
||||
color: blue;
|
||||
text-orientation: sideways;
|
||||
}
|
||||
|
||||
span
|
||||
{
|
||||
font-size: 0.8em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
]]></style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p>
|
||||
|
||||
<div id="rl-sideways">X<span>X</span></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -7,10 +7,13 @@
|
|||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
</head><body><div data-expected="lr" style="writing-mode: lr"></div>
|
||||
<div data-expected="rl" style="writing-mode: rl"></div>
|
||||
</head><body><div data-expected="horizontal-tb" style="writing-mode: lr"></div>
|
||||
<div data-expected="horizontal-tb" style="writing-mode: lr-tb"></div>
|
||||
<div data-expected="horizontal-tb" style="writing-mode: rl"></div>
|
||||
<div data-expected="horizontal-tb" style="writing-mode: rl-tb"></div>
|
||||
|
||||
<div data-expected="tb" style="writing-mode: tb"></div>
|
||||
<div data-expected="vertical-rl" style="writing-mode: tb"></div>
|
||||
<div data-expected="vertical-rl" style="writing-mode: tb-rl"></div>
|
||||
|
||||
<script>
|
||||
Array.prototype.forEach.call(document.querySelectorAll("[data-expected]"), function (element) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue