mirror of
https://github.com/servo/servo.git
synced 2025-06-23 16:44:33 +01:00
296fa2512b
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
1409 lines
No EOL
90 KiB
HTML
1409 lines
No EOL
90 KiB
HTML
|
|
|
|
<!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>Introduction to Writing Modes - CSS Writing Modes Module Level 3 CR Test Suite</title>
|
|
<style type="text/css">
|
|
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
|
@import "../indices.css";
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
|
|
<h2>Introduction to Writing Modes (121 tests)</h2>
|
|
<table width="100%">
|
|
<col id="test-column"></col>
|
|
<col id="refs-column"></col>
|
|
<col id="flags-column"></col>
|
|
<col id="info-column"></col>
|
|
<thead>
|
|
<tr>
|
|
<th>Test</th>
|
|
<th><abbr title="Rendering References">Refs</abbr></th>
|
|
<th>Flags</th>
|
|
<th>Info</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="s1">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s1">+</a>
|
|
<a href="https://www.w3.org/TR/css-writing-modes-3/#text-flow">1 Introduction to Writing Modes</a></th></tr>
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#block-flow-direction">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#horizontal-block-flow">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#horizontal-writing-mode">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#inline-base-direction">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#typographic-mode">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#vertical-block-flow">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#vertical-writing-mode">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.#writing-mode">
|
|
<!-- 121 tests -->
|
|
<tr id="block-flow-direction-004-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-004.xht">block-flow-direction-004</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'writing-mode' - initial value is 'horizontal-tb'
|
|
<ul class="assert">
|
|
<li>This test checks that the default, initial value of writing-mode is 'horizontal-tb'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-htb-001-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-htb-001.xht">block-flow-direction-htb-001</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>horizontal-tb - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of a containing block; they are ordered from top to bottom meaning that the 1st block box is the topmost one, then the 2nd block is juxtaposed at its bottom, then the 3rd block is juxtaposed to the 2nd block at its bottom, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-043-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-043.xht">block-flow-direction-slr-043</a></td>
|
|
<td><a href="reference/block-flow-direction-043-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-047-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-047.xht">block-flow-direction-slr-047</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a right-floated box with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-048-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-048.xht">block-flow-direction-slr-048</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that right-floated boxes with 'writing-mode' set to 'sideways-lr' establish block formating contexts with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-050-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-050.xht">block-flow-direction-slr-050</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-054-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-054.xht">block-flow-direction-slr-054</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-055-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-055.xht">block-flow-direction-slr-055</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-056-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-056.xht">block-flow-direction-slr-056</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-058-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-058.xht">block-flow-direction-slr-058</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-cell with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-060-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-060.xht">block-flow-direction-slr-060</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'sideways-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-caption with its 'writing-mode' set to 'sideways-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-062-1.#writing-mode" class="ahem image">
|
|
<td>
|
|
<a href="block-flow-direction-slr-062.xht">block-flow-direction-slr-062</a></td>
|
|
<td><a href="reference/block-flow-direction-043-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>list and sideways-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and then the 2nd block is juxtaposed to the right-hand side of 1st block, the 3rd block is juxtaposed to the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-063-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-slr-063.xht">block-flow-direction-slr-063</a></td>
|
|
<td><a href="reference/block-flow-direction-043-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-slr-066-1.#writing-mode" class="image">
|
|
<td>
|
|
<a href="block-flow-direction-slr-066.xht">block-flow-direction-slr-066</a></td>
|
|
<td><a href="reference/block-flow-direction-066-ref.xht">=</a> </td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>writing mode (sideways-lr) of document - horizontal position of first block
|
|
<ul class="assert">
|
|
<li>This test checks that, when 'writing-mode' value of the root element is set to 'sideways-lr', then its block boxes are laid out rightwardedly (from left to right) one after the other beginning at its lefthand side. Also, the inline flow direction is 'topwardedly', that is inline boxes in the line box flow from the bottom toward the top; inline boxes are laid out vertically, one after the other, starting at the physical bottom side of its containing block.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-042-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-042.xht">block-flow-direction-srl-042</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-045-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-045.xht">block-flow-direction-srl-045</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a left-floated box with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-046-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-046.xht">block-flow-direction-srl-046</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that left-floated boxes with 'writing-mode' set to 'sideways-rl' establish block formating contexts with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-049-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-049.xht">block-flow-direction-srl-049</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-051-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-051.xht">block-flow-direction-srl-051</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-052-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-052.xht">block-flow-direction-srl-052</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-053-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-053.xht">block-flow-direction-srl-053</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-057-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-057.xht">block-flow-direction-srl-057</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-cell with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-059-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-059.xht">block-flow-direction-srl-059</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'sideways-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-caption with its 'writing-mode' set to 'sideways-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-061-1.#writing-mode" class="ahem image">
|
|
<td>
|
|
<a href="block-flow-direction-srl-061.xht">block-flow-direction-srl-061</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>list and sideways-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one and then the 2nd block is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-064-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-srl-064.xht">block-flow-direction-srl-064</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'sideways-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-srl-065-1.#writing-mode" class="image">
|
|
<td>
|
|
<a href="block-flow-direction-srl-065.xht">block-flow-direction-srl-065</a></td>
|
|
<td><a href="reference/block-flow-direction-025-ref.xht">=</a> </td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>writing mode (sideways-rl) of document - horizontal position of first block
|
|
<ul class="assert">
|
|
<li>This test checks that, when 'writing-mode' value of the root element is set to 'sideways-rl', then its block boxes are laid out leftwardedly (from right to left) one after the other beginning at its righthand side. Also, the inline flow direction is 'bottomwardedly', that is inline boxes in the line box flow from the top toward the bottom; inline boxes are laid out vertically, one after the other, starting at the physical top side of its containing block.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-003-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-003.xht">block-flow-direction-vlr-003</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-007-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-007.xht">block-flow-direction-vlr-007</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a right-floated box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-008-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-008.xht">block-flow-direction-vlr-008</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that right-floated boxes with 'writing-mode' set to 'vertical-lr' establish block formating contexts with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-010-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-010.xht">block-flow-direction-vlr-010</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-014-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-014.xht">block-flow-direction-vlr-014</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-015-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-015.xht">block-flow-direction-vlr-015</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-016-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-016.xht">block-flow-direction-vlr-016</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-018-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-018.xht">block-flow-direction-vlr-018</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-cell with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-020-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-020.xht">block-flow-direction-vlr-020</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'vertical-lr' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-caption with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-022-1.#writing-mode" class="ahem image">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-022.xht">block-flow-direction-vlr-022</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>list and vertical-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and then the 2nd block is juxtaposed to the right-hand side of 1st block, the 3rd block is juxtaposed to the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vlr-023-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vlr-023.xht">block-flow-direction-vlr-023</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-002-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-002.xht">block-flow-direction-vrl-002</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-005-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-005.xht">block-flow-direction-vrl-005</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a left-floated box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-006-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-006.xht">block-flow-direction-vrl-006</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that left-floated boxes with 'writing-mode' set to 'vertical-rl' establish block formating contexts with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-009-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-009.xht">block-flow-direction-vrl-009</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-011-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-011.xht">block-flow-direction-vrl-011</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-012-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-012.xht">block-flow-direction-vrl-012</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-013-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-013.xht">block-flow-direction-vrl-013</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-017-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-017.xht">block-flow-direction-vrl-017</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-cell with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-019-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-019.xht">block-flow-direction-vrl-019</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'vertical-rl' - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that a table-caption with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-021-1.#writing-mode" class="ahem image">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-021.xht">block-flow-direction-vrl-021</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>list and vertical-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one and then the 2nd block is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-024-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-024.xht">block-flow-direction-vrl-024</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - block flow direction of block-level boxes
|
|
<ul class="assert">
|
|
<li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="block-flow-direction-vrl-025-1.#writing-mode" class="image">
|
|
<td>
|
|
<a href="block-flow-direction-vrl-025.xht">block-flow-direction-vrl-025</a></td>
|
|
<td><a href="reference/block-flow-direction-025-ref.xht">=</a> </td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>writing mode of document - horizontal position of first block
|
|
<ul class="assert">
|
|
<li>This test checks that, when 'writing-mode' value of the root element is set to 'vertical-rl', then its block boxes are laid out leftwardedly (from right to left) one after the other beginning at its righthand side.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="cursor-text-001-1.#writing-mode" class="interact may">
|
|
<td>
|
|
<a href="cursor-text-001.xht">cursor-text-001</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr><abbr class="may" title="Behavior tested is preferred but optional">Optional</abbr></td>
|
|
<td>cursor:text with vertical text
|
|
<ul class="assert">
|
|
<li>User agents may automatically display a horizontal I-beam/cursor (e.g. same as the vertical-text keyword) for vertical text.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="different-block-flow-dir-001-1.#writing-mode" class="">
|
|
<td>
|
|
<a href="different-block-flow-dir-001.xht">different-block-flow-dir-001</a></td>
|
|
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
|
<td></td>
|
|
<td>descendant inline with a different 'writing-mode' value
|
|
<ul class="assert">
|
|
<li>This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="different-block-flow-dir-002-1.#writing-mode" class="">
|
|
<td>
|
|
<a href="different-block-flow-dir-002.xht">different-block-flow-dir-002</a></td>
|
|
<td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td>
|
|
<td></td>
|
|
<td>descendant inline with a different 'writing-mode' value
|
|
<ul class="assert">
|
|
<li>This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="first-page-vlr-003-1.#writing-mode" class="paged">
|
|
<td>
|
|
<a href="first-page-vlr-003.xht">first-page-vlr-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>first page of a document with vertical-lr writing-mode
|
|
<ul class="assert">
|
|
<li>When 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is left-to-right. This test checks that the first page of a document whose document root has 'writing-mode' set to 'vertical-lr' is the :right page.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="first-page-vrl-002-1.#writing-mode" class="image paged">
|
|
<td>
|
|
<a href="first-page-vrl-002.xht">first-page-vrl-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>first page of a document with vertical-rl writing-mode
|
|
<ul class="assert">
|
|
<li>When 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is right-to-left. This test checks that the first page of a document whose document root has 'writing-mode' set to 'vertical-rl' is the :left page.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="flexbox_align-items-stretch-writing-modes-1.#writing-mode" class="">
|
|
<td>
|
|
<a href="flexbox_align-items-stretch-writing-modes.xht">flexbox_align-items-stretch-writing-modes</a></td>
|
|
<td><a href="reference/flexbox_align-items-stretch-writing-modes-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>Flexbox align-items: stretch with writing-mode vertical-lr and vertical-rl
|
|
<ul class="assert">
|
|
<li>vertical-writing-mode flex items should stretch</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-slr-004-1.#writing-mode" class="image should">
|
|
<td>
|
|
<a href="form-controls-slr-004.xht">form-controls-slr-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>order, orientation and layout of form controls in 'sideways-lr' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1 when the 'writing-mode' of the whole form element is set to 'sideways-lr'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-slr-005-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="form-controls-slr-005.xht">form-controls-slr-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>form controls in 'sideways-lr' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'sideways-lr' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from bottom to top, b) the glyphs must be rotated 90&deg; counter-clockwise and c) the block flow direction must be from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-srl-004-1.#writing-mode" class="image should">
|
|
<td>
|
|
<a href="form-controls-srl-004.xht">form-controls-srl-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>order, orientation and layout of form controls in 'sideways-rl' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1 when the 'writing-mode' of the whole form element is set to 'sideways-rl'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-srl-005-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="form-controls-srl-005.xht">form-controls-srl-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>form controls in 'sideways-rl' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'sideways-rl' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90&deg; clockwise and c) the block flow direction must be from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-vlr-004-1.#writing-mode" class="image should">
|
|
<td>
|
|
<a href="form-controls-vlr-004.xht">form-controls-vlr-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>order, orientation and layout of form controls in 'vertical-lr' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1 when the 'writing-mode' of the whole form element is set to 'vertical-lr'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-vlr-005-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="form-controls-vlr-005.xht">form-controls-vlr-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>form controls in 'vertical-lr' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'vertical-lr' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90&deg; clockwise and c) the block flow direction must be from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-vrl-004-1.#writing-mode" class="image should">
|
|
<td>
|
|
<a href="form-controls-vrl-004.xht">form-controls-vrl-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>order, orientation and layout of form controls in 'vertical-rl' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1 when the 'writing-mode' of the whole form element is set to 'vertical-rl'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="form-controls-vrl-005-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="form-controls-vrl-005.xht">form-controls-vrl-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>form controls in 'vertical-rl' writing-mode
|
|
<ul class="assert">
|
|
<li>This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'vertical-rl' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90&deg; clockwise and c) the block flow direction must be from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="inline-replaced-vlr-003-1.#writing-mode" class="image">
|
|
<td>
|
|
<a href="inline-replaced-vlr-003.xht">inline-replaced-vlr-003</a></td>
|
|
<td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>inline replaced element and 'vertical-lr'
|
|
<ul class="assert">
|
|
<li>This test checks that the content of an inline replaced element does not rotate due to the writing mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="inline-replaced-vrl-002-1.#writing-mode" class="image">
|
|
<td>
|
|
<a href="inline-replaced-vrl-002.xht">inline-replaced-vrl-002</a></td>
|
|
<td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
|
<td>inline replaced element and 'vertical-rl'
|
|
<ul class="assert">
|
|
<li>This test checks that the content of an inline replaced element does not rotate due to the writing mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-htb-001-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-htb-001.xht">line-box-direction-htb-001</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>horizontal-tb - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of a block box in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of the block box; they are ordered from top to bottom meaning that the 1st line box is the topmost one and then the 2nd block is juxtaposed to its bottom, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-043-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-043.xht">line-box-direction-slr-043</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-lr - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes in a block box with 'writing-mode' set to 'sideways-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-047-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-047.xht">line-box-direction-slr-047</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of a right-floated box with its 'writing-mode' set to 'sideways-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-048-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-048.xht">line-box-direction-slr-048</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of right-floated boxes with 'writing-mode' set to 'sideways-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-050-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-050.xht">line-box-direction-slr-050</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'sideways-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-053-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-053.xht">line-box-direction-slr-053</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'sideways-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-054-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-054.xht">line-box-direction-slr-054</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'sideways-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-056-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-056.xht">line-box-direction-slr-056</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'sideways-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-058-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-058.xht">line-box-direction-slr-058</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'sideways-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-slr-060-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-slr-060.xht">line-box-direction-slr-060</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>list and 'sideways-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes in a block box with 'writing-mode' set to 'sideways-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-042-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-042.xht">line-box-direction-srl-042</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-rl - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of a block box in a 'sideways-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-045-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-045.xht">line-box-direction-srl-045</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of a left-floated box with its 'writing-mode' set to 'sideways-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-046-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-046.xht">line-box-direction-srl-046</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of left-floated boxes with 'writing-mode' set to 'sideways-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-049-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-049.xht">line-box-direction-srl-049</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'sideways-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-051-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-051.xht">line-box-direction-srl-051</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'sideways-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-052-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-052.xht">line-box-direction-srl-052</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'sideways-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-055-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-055.xht">line-box-direction-srl-055</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'sideways-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-057-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-057.xht">line-box-direction-srl-057</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'sideways-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-srl-059-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-srl-059.xht">line-box-direction-srl-059</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>list and 'sideways-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of a block box in a 'sideways-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-003-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-003.xht">line-box-direction-vlr-003</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-007-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-007.xht">line-box-direction-vlr-007</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of a right-floated box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-008-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-008.xht">line-box-direction-vlr-008</a></td>
|
|
<td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: right' and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of right-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-010-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-010.xht">line-box-direction-vlr-010</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-013-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-013.xht">line-box-direction-vlr-013</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-014-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-014.xht">line-box-direction-vlr-014</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-016-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-016.xht">line-box-direction-vlr-016</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-018-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-018.xht">line-box-direction-vlr-018</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vlr-020-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vlr-020.xht">line-box-direction-vlr-020</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>list and 'vertical-lr' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-002-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-002.xht">line-box-direction-vrl-002</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-005-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-005.xht">line-box-direction-vrl-005</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of a left-floated box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-006-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-006.xht">line-box-direction-vrl-006</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>'float: left' and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the line boxes of left-floated boxes with 'writing-mode' set to 'vertical-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-009-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-009.xht">line-box-direction-vrl-009</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>position absolute and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-011-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-011.xht">line-box-direction-vrl-011</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-012-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-012.xht">line-box-direction-vrl-012</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>inline-block and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-015-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-015.xht">line-box-direction-vrl-015</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-cell and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-017-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-017.xht">line-box-direction-vrl-017</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>table-caption and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="line-box-direction-vrl-019-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="line-box-direction-vrl-019.xht">line-box-direction-vrl-019</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>list and 'vertical-rl' - ordering direction of line boxes
|
|
<ul class="assert">
|
|
<li>This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="page-flow-direction-002-1.#writing-mode" class="image paged">
|
|
<td>
|
|
<a href="page-flow-direction-002.xht">page-flow-direction-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>'writing-mode: vertical-rl' - default page flow (progression) direction
|
|
<ul class="assert">
|
|
<li>This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is right-to-left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="page-flow-direction-003-1.#writing-mode" class="image paged">
|
|
<td>
|
|
<a href="page-flow-direction-003.xht">page-flow-direction-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>'writing-mode: vertical-lr' - default page flow (progression) direction
|
|
<ul class="assert">
|
|
<li>This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is left-to-right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="page-flow-direction-slr-005-1.#writing-mode" class="image paged">
|
|
<td>
|
|
<a href="page-flow-direction-slr-005.xht">page-flow-direction-slr-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>'writing-mode: sideways-lr' - default page flow (progression) direction
|
|
<ul class="assert">
|
|
<li>This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is left-to-right.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="page-flow-direction-srl-004-1.#writing-mode" class="image paged">
|
|
<td>
|
|
<a href="page-flow-direction-srl-004.xht">page-flow-direction-srl-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td>
|
|
<td>'writing-mode: sideways-rl' - default page flow (progression) direction
|
|
<ul class="assert">
|
|
<li>This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is right-to-left.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="replaced-content-image-002-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="replaced-content-image-002.xht">replaced-content-image-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>alternate text of image and vertical writing mode
|
|
<ul class="assert">
|
|
<li>This test checks that alternate text (latin) of image rotates 90&deg; clockwise in vertical writing mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="replaced-content-image-003-1.#writing-mode" class="should">
|
|
<td>
|
|
<a href="replaced-content-image-003.xht">replaced-content-image-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td>
|
|
<td>alternate text of image and vertical writing mode
|
|
<ul class="assert">
|
|
<li>This test checks that alternate text (latin) of image rotates 90&deg; clockwise in vertical writing mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-slr-023-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-slr-023.xht">row-progression-slr-023</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-lr - table rows progression
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'sideways-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc... Table cells and table columns in a table with writing-mode set to 'sideways-lr' are ordered according to inline flow direction, which is from bottom to top.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-slr-029-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-slr-029.xht">row-progression-slr-029</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-lr - table rows progression (thead, 2 tbodies, tfoot)
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'sideways-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc... Table cells and table columns in a table with writing-mode set to 'sideways-lr' are ordered according to inline flow direction, which is from bottom to top.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-srl-022-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-srl-022.xht">row-progression-srl-022</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-rl - table rows progression
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'sideways-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-srl-028-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-srl-028.xht">row-progression-srl-028</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>sideways-rl - table rows progression (thead, 2 tbodies, tfoot)
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'sideways-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vlr-003-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vlr-003.xht">row-progression-vlr-003</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - table rows progression
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vlr-005-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vlr-005.xht">row-progression-vlr-005</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - table rows progression and colspan
|
|
<ul class="assert">
|
|
<li>This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vlr-007-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vlr-007.xht">row-progression-vlr-007</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - table rows progression and rowspan
|
|
<ul class="assert">
|
|
<li>This test checks that rowspanned cells in a table are handled according to a left-to-right direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vlr-009-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vlr-009.xht">row-progression-vlr-009</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-lr - table rows progression (thead, 2 tbodies, tfoot)
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc... Table cells in a table with writing-mode set to 'sideways-lr' are ordered according to inline flow direction, which is from bottom to top.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vrl-002-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vrl-002.xht">row-progression-vrl-002</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - table rows progression
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vrl-004-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vrl-004.xht">row-progression-vrl-004</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - table rows progression and colspan
|
|
<ul class="assert">
|
|
<li>This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vrl-006-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vrl-006.xht">row-progression-vrl-006</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - table rows progression and rowspan
|
|
<ul class="assert">
|
|
<li>This test checks that rowspanned cells in a table are handled according to a right-to-left direction.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="row-progression-vrl-008-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="row-progression-vrl-008.xht">row-progression-vrl-008</a></td>
|
|
<td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>vertical-rl - table rows progression (thead, 2 tbodies, tfoot)
|
|
<ul class="assert">
|
|
<li>This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="writing-mode-vertical-rl-003-1.#writing-mode" class="ahem">
|
|
<td>
|
|
<a href="writing-mode-vertical-rl-003.xht">writing-mode-vertical-rl-003</a></td>
|
|
<td><a href="reference/writing-mode-vertical-rl-003-ref.xht">=</a> </td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
|
<td>writing-mode: horizontal-tb nested in vertical-rl
|
|
<ul class="assert">
|
|
<li>when child block has its own writing-mode, child block's writing-mode overwrites parent block's writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s1.1">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s1.1">+</a>
|
|
<a href="https://www.w3.org/TR/css-writing-modes-3/#placement">1.1 Module Interactions</a></th></tr>
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.2">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s1.2">+</a>
|
|
<a href="https://www.w3.org/TR/css-writing-modes-3/#values">1.2 Value Types and Terminology</a></th></tr>
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s1.2.#bidi">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
</table>
|
|
|
|
</body>
|
|
</html> |