servo/tests/wpt/css-tests/css-writing-modes-3_dev/html/chapter-4.htm

419 lines
No EOL
25 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Inline-level Alignment - 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>Inline-level Alignment (31 tests)</h2>
<table width="100%">
<col id="test-column">
<col id="refs-column">
<col id="flags-column">
<col id="info-column">
<thead>
<tr>
<th>Test</th>
<th><abbr title="Rendering References">Refs</abbr></th>
<th>Flags</th>
<th>Info</th>
</tr>
</thead>
<tbody id="s4">
<tr><th colspan="4" scope="rowgroup">
<a href="#s4">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#inline-alignment">4 Inline-level Alignment</a></th></tr>
<!-- 0 tests -->
</tbody>
<tbody id="s4.1">
<tr><th colspan="4" scope="rowgroup">
<a href="#s4.1">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#intro-baselines">4.1 Introduction to Baselines</a></th></tr>
<!-- 0 tests -->
</tbody>
<tbody id="s4.1.#baseline">
<!-- 0 tests -->
</tbody>
<tbody id="s4.1.#baseline-table">
<!-- 0 tests -->
</tbody>
<tbody id="s4.2">
<tr><th colspan="4" scope="rowgroup">
<a href="#s4.2">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines">4.2 Text Baselines</a></th></tr>
<!-- 8 tests -->
<tr id="central-baseline-alignment-002-4.2" class="primary ahem">
<td><strong>
<a href="central-baseline-alignment-002.htm">central-baseline-alignment-002</a></strong></td>
<td><a href="reference/central-baseline-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>central baseline-alignment of text with 'text-orientation: upright' (vertical-rl)
<ul class="assert">
<li>This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode.</li>
</ul>
</td>
</tr>
<tr id="central-baseline-alignment-003-4.2" class="primary ahem">
<td><strong>
<a href="central-baseline-alignment-003.htm">central-baseline-alignment-003</a></strong></td>
<td><a href="reference/central-baseline-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>central baseline-alignment of text with 'text-orientation: upright' (vertical-lr)
<ul class="assert">
<li>This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-002-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-002.htm">text-baseline-002</a></strong></td>
<td><a href="reference/text-baseline-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - central alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-003-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-003.htm">text-baseline-003</a></strong></td>
<td><a href="reference/text-baseline-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - central alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-004-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-004.htm">text-baseline-004</a></strong></td>
<td><a href="reference/text-baseline-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - central alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-005-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-005.htm">text-baseline-005</a></strong></td>
<td><a href="reference/text-baseline-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - central alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-006-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-006.htm">text-baseline-006</a></strong></td>
<td><a href="reference/text-baseline-006-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - alphabetical alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
<tr id="text-baseline-007-4.2" class="primary ahem">
<td><strong>
<a href="text-baseline-007.htm">text-baseline-007</a></strong></td>
<td><a href="reference/text-baseline-006-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment - alphabetical alignment with vertical layout
<ul class="assert">
<li>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.</li>
</ul>
</td>
</tr>
</tbody>
<tbody id="s4.2.#alphabetic-baseline">
<!-- 0 tests -->
</tbody>
<tbody id="s4.2.#central-baseline">
<!-- 0 tests -->
</tbody>
<tbody id="s4.3">
<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 -->
<tr id="baseline-inline-non-replaced-002-4.3" class="primary ahem">
<td><strong>
<a href="baseline-inline-non-replaced-002.htm">baseline-inline-non-replaced-002</a></strong></td>
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'
<ul class="assert">
<li>This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="baseline-inline-non-replaced-003-4.3" class="primary ahem">
<td><strong>
<a href="baseline-inline-non-replaced-003.htm">baseline-inline-non-replaced-003</a></strong></td>
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'
<ul class="assert">
<li>This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="baseline-inline-non-replaced-004-4.3" class="primary ahem">
<td><strong>
<a href="baseline-inline-non-replaced-004.htm">baseline-inline-non-replaced-004</a></strong></td>
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'
<ul class="assert">
<li>This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="baseline-inline-non-replaced-005-4.3" class="primary ahem">
<td><strong>
<a href="baseline-inline-non-replaced-005.htm">baseline-inline-non-replaced-005</a></strong></td>
<td><a href="reference/ref-filled-green-100px-square.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'
<ul class="assert">
<li>This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="baseline-inline-replaced-002-4.3" class="primary ahem image">
<td><strong>
<a href="baseline-inline-replaced-002.htm">baseline-inline-replaced-002</a></strong></td>
<td><a href="reference/baseline-inline-replaced-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>baseline-alignment of inline replaced element and 'vertical-rl'
<ul class="assert">
<li>This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="baseline-inline-replaced-003-4.3" class="primary ahem image">
<td><strong>
<a href="baseline-inline-replaced-003.htm">baseline-inline-replaced-003</a></strong></td>
<td><a href="reference/baseline-inline-replaced-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>baseline-alignment of inline replaced element and 'vertical-lr'
<ul class="assert">
<li>This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-lr' is 'central' and not 'alphabetic'.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-002-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-002.htm">inline-block-alignment-002</a></strong></td>
<td><a href="reference/inline-block-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-block alignment - central 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 'mixed', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-003-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-003.htm">inline-block-alignment-003</a></strong></td>
<td><a href="reference/inline-block-alignment-003-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-block alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-block baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-004-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-004.htm">inline-block-alignment-004</a></strong></td>
<td><a href="reference/inline-block-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-block alignment - central 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 'upright', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-005-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-005.htm">inline-block-alignment-005</a></strong></td>
<td><a href="reference/inline-block-alignment-003-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-block alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-block baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-006-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-006.htm">inline-block-alignment-006</a></strong></td>
<td><a href="reference/inline-block-alignment-006-ref.htm">=</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', then the alphabetical baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-007-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-007.htm">inline-block-alignment-007</a></strong></td>
<td><a href="reference/inline-block-alignment-006-ref.htm">=</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-lr' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-008-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-008.htm">inline-block-alignment-008</a></strong></td>
<td><a href="reference/inline-block-alignment-006-ref.htm">=</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.htm">inline-block-alignment-orthogonal-vlr-003</a></strong></td>
<td><a href="reference/inline-block-alignment-orthogonal-vrl-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment of inline-block in orthogonal flow
<ul class="assert">
<li>This test checks the generation of text baseline. When 'writing-mode' of the containing block of an inline-block in orthogonal flow is 'horizontal-tb', then the dominant baseline used is the alphabetical baseline. In this test, the inline-block should be 'sitting' on the alphabetical baseline, therefore creating a straight and unbroken bottom edge.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-orthogonal-vlr-005-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-orthogonal-vlr-005.htm">inline-block-alignment-orthogonal-vlr-005</a></strong></td>
<td><a href="reference/inline-block-alignment-orthogonal-vrl-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment of inline-block in orthogonal flow
<ul class="assert">
<li>This test checks the generation of text baseline. When 'writing-mode' of the containing block of an inline-block in orthogonal flow is 'horizontal-tb', then the dominant baseline used is the alphabetical baseline. In this test, the inline-block should be 'sitting' on the alphabetical baseline, therefore creating a straight and unbroken bottom edge.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-orthogonal-vrl-002-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-orthogonal-vrl-002.htm">inline-block-alignment-orthogonal-vrl-002</a></strong></td>
<td><a href="reference/inline-block-alignment-orthogonal-vrl-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment of inline-block in orthogonal flow
<ul class="assert">
<li>This test checks the generation of text baseline. When 'writing-mode' of the containing block of an inline-block in orthogonal flow is 'horizontal-tb', then the dominant baseline used is the alphabetical baseline. In this test, the inline-block should be 'sitting' on the alphabetical baseline, therefore creating a straight and unbroken bottom edge.</li>
</ul>
</td>
</tr>
<tr id="inline-block-alignment-orthogonal-vrl-004-4.3" class="primary ahem">
<td><strong>
<a href="inline-block-alignment-orthogonal-vrl-004.htm">inline-block-alignment-orthogonal-vrl-004</a></strong></td>
<td><a href="reference/inline-block-alignment-orthogonal-vrl-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>text baseline alignment of inline-block in orthogonal flow
<ul class="assert">
<li>This test checks the generation of text baseline. When 'writing-mode' of the containing block of an inline-block in orthogonal flow is 'horizontal-tb', then the dominant baseline used is the alphabetical baseline. In this test, the inline-block should be 'sitting' on the alphabetical baseline, therefore creating a straight and unbroken bottom edge.</li>
</ul>
</td>
</tr>
<tr id="inline-replaced-vlr-005-4.3" class="primary ahem image">
<td><strong>
<a href="inline-replaced-vlr-005.htm">inline-replaced-vlr-005</a></strong></td>
<td><a href="reference/inline-replaced-vrl-004-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>inline replaced element and 'vertical-lr' (advanced)
<ul class="assert">
<li>This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from left to right.</li>
</ul>
</td>
</tr>
<tr id="inline-replaced-vrl-004-4.3" class="primary ahem image">
<td><strong>
<a href="inline-replaced-vrl-004.htm">inline-replaced-vrl-004</a></strong></td>
<td><a href="reference/inline-replaced-vrl-004-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>inline replaced element and 'vertical-rl' (advanced)
<ul class="assert">
<li>This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from right to left.</li>
</ul>
</td>
</tr>
<tr id="inline-table-alignment-002-4.3" class="primary ahem">
<td><strong>
<a href="inline-table-alignment-002.htm">inline-table-alignment-002</a></strong></td>
<td><a href="reference/inline-table-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-table alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-table baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-table-alignment-003-4.3" class="primary ahem">
<td><strong>
<a href="inline-table-alignment-003.htm">inline-table-alignment-003</a></strong></td>
<td><a href="reference/inline-table-alignment-003-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-table alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-table baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-table-alignment-004-4.3" class="primary ahem">
<td><strong>
<a href="inline-table-alignment-004.htm">inline-table-alignment-004</a></strong></td>
<td><a href="reference/inline-table-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-table alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-table baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="inline-table-alignment-005-4.3" class="primary ahem">
<td><strong>
<a href="inline-table-alignment-005.htm">inline-table-alignment-005</a></strong></td>
<td><a href="reference/inline-table-alignment-003-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>inline-table alignment - central alignment with vertical layout
<ul class="assert">
<li>This test checks the generation of inline-table baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
</tbody>
<tbody id="s4.4">
<tr><th colspan="4" scope="rowgroup">
<a href="#s4.4">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">4.4 Baseline Alignment</a></th></tr>
<!-- 0 tests -->
</tbody>
<tbody id="s4.4.#dominant-baseline">
<!-- 0 tests -->
</tbody>
</table>
</body>
</html>