Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-12 00:45:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update CSS tests to revision 584b6cdd10401df603bd7bdf4ec801fcddc65468

Browse source
This commit is contained in:
Ms2ger 2015-09-04 12:21:22 +02:00
parent 8d21a79246
commit 58b5cd27de
1279 changed files with 30378 additions and 18158 deletions
Download patch file Download diff file Expand all files Collapse all files

44
tests/wpt/css-tests/css-writing-modes-3_dev/html/bidi-004.htm Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Test: The bidi algorithm and inlines in CSS</title>
<link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch">
<link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/inline/bidi/004.html" type="text/html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model">
<link rel="help" href="http://www.w3.org/TR/css-text-3/#white-space-rules">
<!-- Spaces are collapsed, then reordered, then trimmed. -->
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes">
<link rel="help" href="http://www.w3.org/TR/CSS21/box.html#bidi-box-model">
<link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#direction">
<link rel="help" href="http://www.w3.org/TR/CSS21/text.html#white-space-model">
<link rel="help" href="http://unicode.org/reports/tr9/">
<link rel="help" href="http://www.w3.org/TR/html5/rendering.html#phrasing-content-0"> <!-- <br> is a bidi paragraph separator -->
<link rel="match" href="reference/bidi-004-ref.htm">
<meta name="flags" content="may21 ahem">
<style type="text/css">
div p { width: 28em; border: solid; margin: 1em; padding: 0.5em; background: #FFFFCC; color: black; font: 1em/1 Ahem; }
.test { border: solid; padding: 0.4em 1em; line-height: 3em; }
.control { line-height: 3em; }
.control.start { border-style: solid none solid solid; padding: 0.4em 0 0.4em 1em; }
.control.middle { border-style: solid none solid none; padding: 0.4em 0 0.4em 0; }
.control.end { border-style: solid solid solid none; padding: 0.4em 1em 0.4em 0; }
.a { color: navy; }
.b { color: orange; }
</style>
</head>
<body>
<p> The following two blocks should be identical, including overflow. (Force bidi: א) </p>
<div>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
<p>
<!-- (note that everything between the RLO to the PDF is backwards) -->
<!-- line 1...................--> <!-- line 2........................................--> <!-- line 3...................-->
<span class="test a"> pppp pppX ppXp &#x202E; ppXp XXpp XppX </span> pppX XXXp pXXp <span class="test b"> XpXp ppXX XXpX pXpX &#x202C; XXpX XXXp </span>
</p>
</div>
</body>
</html>

12
tests/wpt/css-tests/css-writing-modes-3_dev/html/chapter-2.htm
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Inline Direction and Bidirectionality (162 tests)</h2>
<h2>Inline Direction and Bidirectionality (163 tests)</h2>
<table width="100%">
<col id="test-column">
<col id="refs-column">
@ -1613,7 +1613,7 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s2.4">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model">2.4 Box model for inline boxes in bidirectional context</a></th></tr>
<!-- 25 tests -->
<!-- 26 tests -->
<tr id="bidi-001-2.4" class="primary">
<td><strong>
<a href="bidi-001.htm">bidi-001</a></strong></td>
@ -1647,6 +1647,14 @@
</ul>
</td>
</tr>
<tr id="bidi-004-2.4" class="primary ahem may21">
<td><strong>
<a href="bidi-004.htm">bidi-004</a></strong></td>
<td><a href="reference/bidi-004-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="may21" title="Behavior tested is preferred but optional">Optional</abbr></td>
<td>The bidi algorithm and inlines in CSS
</td>
</tr>
<tr id="bidi-005-2.4" class="">
<td>
<a href="bidi-005.htm">bidi-005</a></td>

356
tests/wpt/css-tests/css-writing-modes-3_dev/html/chapter-4.htm
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Inline-level Alignment (70 tests)</h2>
<h2>Inline-level Alignment (38 tests)</h2>
<table width="100%">
<col id="test-column">
<col id="refs-column">
@ -485,359 +485,7 @@
<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>
<!-- 32 tests -->
<tr id="vertical-alignment-002a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-002a.htm">vertical-alignment-002a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-002b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-002b.htm">vertical-alignment-002b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-003a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-003a.htm">vertical-alignment-003a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-003b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-003b.htm">vertical-alignment-003b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-005a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-005a.htm">vertical-alignment-005a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'sub' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-005b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-005b.htm">vertical-alignment-005b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'sub' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-008a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-008a.htm">vertical-alignment-008a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'super' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-008b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-008b.htm">vertical-alignment-008b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'super' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-011a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-011a.htm">vertical-alignment-011a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-011b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-011b.htm">vertical-alignment-011b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-012l-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-012l.htm">vertical-alignment-012l</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-012r-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-012r.htm">vertical-alignment-012r</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-014a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-014a.htm">vertical-alignment-014a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-014b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-014b.htm">vertical-alignment-014b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-015a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-015a.htm">vertical-alignment-015a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-015b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-015b.htm">vertical-alignment-015b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-017a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-017a.htm">vertical-alignment-017a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-017b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-017b.htm">vertical-alignment-017b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-018a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-018a.htm">vertical-alignment-018a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-018b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-018b.htm">vertical-alignment-018b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-020a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-020a.htm">vertical-alignment-020a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-020b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-020b.htm">vertical-alignment-020b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-021a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-021a.htm">vertical-alignment-021a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-021b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-021b.htm">vertical-alignment-021b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-023a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-023a.htm">vertical-alignment-023a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-023b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-023b.htm">vertical-alignment-023b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (80%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-024a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-024a.htm">vertical-alignment-024a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-024b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-024b.htm">vertical-alignment-024b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-026a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-026a.htm">vertical-alignment-026a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-20%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-026b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-026b.htm">vertical-alignment-026b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-20%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-027a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-027a.htm">vertical-alignment-027a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-027b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-027b.htm">vertical-alignment-027b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<!-- 0 tests -->
</tbody>
<tbody id="s4.4.#dominant-baseline">
<!-- 0 tests -->

118
tests/wpt/css-tests/css-writing-modes-3_dev/html/chapter-7.htm
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Abstract Box Layout (489 tests)</h2>
<h2>Abstract Box Layout (495 tests)</h2>
<table width="100%">
<col id="test-column">
<col id="refs-column">
@ -4637,7 +4637,7 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s7.5">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">7.5 Line-Relative Mappings</a></th></tr>
<!-- 26 tests -->
<!-- 32 tests -->
<tr id="text-decoration-sidewaysleft-vlr-003-7.5" class="primary">
<td><strong>
<a href="text-decoration-sidewaysleft-vlr-003.htm">text-decoration-sidewaysleft-vlr-003</a></strong></td>
@ -4836,10 +4836,76 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-002-7.5" class="primary ahem">
<tr id="underline-font-size-vlr-003-7.5" class="primary">
<td><strong>
<a href="vertical-alignment-new-002.htm">vertical-alignment-new-002</a></strong></td>
<td><a href="reference/vertical-alignment-new-002-ref.htm">=</a> </td>
<a href="underline-font-size-vlr-003.htm">underline-font-size-vlr-003</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vlr-005-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vlr-005.htm">underline-font-size-vlr-005</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vrl-002-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vrl-002.htm">underline-font-size-vrl-002</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vrl-004-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vrl-004.htm">underline-font-size-vrl-004</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-mixed-vlr-003-7.5" class="primary">
<td><strong>
<a href="underline-mixed-vlr-003.htm">underline-mixed-vlr-003</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.</li>
</ul>
</td>
</tr>
<tr id="underline-mixed-vrl-002-7.5" class="primary">
<td><strong>
<a href="underline-mixed-vrl-002.htm">underline-mixed-vrl-002</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-002-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-002.htm">vertical-alignment-002</a></strong></td>
<td><a href="reference/vertical-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'top' and vertical-rl writing-mode
<ul class="assert">
@ -4847,10 +4913,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-003-7.5" class="primary ahem">
<tr id="vertical-alignment-003-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-003.htm">vertical-alignment-new-003</a></strong></td>
<td><a href="reference/vertical-alignment-new-002-ref.htm">=</a> </td>
<a href="vertical-alignment-003.htm">vertical-alignment-003</a></strong></td>
<td><a href="reference/vertical-alignment-002-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'top' and vertical-lr writing-mode
<ul class="assert">
@ -4858,10 +4924,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-004-7.5" class="primary ahem">
<tr id="vertical-alignment-004-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-004.htm">vertical-alignment-new-004</a></strong></td>
<td><a href="reference/vertical-alignment-new-004-ref.htm">=</a> </td>
<a href="vertical-alignment-004.htm">vertical-alignment-004</a></strong></td>
<td><a href="reference/vertical-alignment-004-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-top' and vertical-rl writing-mode
<ul class="assert">
@ -4869,10 +4935,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-005-7.5" class="primary ahem">
<tr id="vertical-alignment-005-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-005.htm">vertical-alignment-new-005</a></strong></td>
<td><a href="reference/vertical-alignment-new-004-ref.htm">=</a> </td>
<a href="vertical-alignment-005.htm">vertical-alignment-005</a></strong></td>
<td><a href="reference/vertical-alignment-004-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-top' and vertical-lr writing-mode
<ul class="assert">
@ -4880,10 +4946,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-006-7.5" class="primary ahem">
<tr id="vertical-alignment-006-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-006.htm">vertical-alignment-new-006</a></strong></td>
<td><a href="reference/vertical-alignment-new-006-ref.htm">=</a> </td>
<a href="vertical-alignment-006.htm">vertical-alignment-006</a></strong></td>
<td><a href="reference/vertical-alignment-006-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-bottom' and vertical-rl writing-mode
<ul class="assert">
@ -4891,10 +4957,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-007-7.5" class="primary ahem">
<tr id="vertical-alignment-007-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-007.htm">vertical-alignment-new-007</a></strong></td>
<td><a href="reference/vertical-alignment-new-006-ref.htm">=</a> </td>
<a href="vertical-alignment-007.htm">vertical-alignment-007</a></strong></td>
<td><a href="reference/vertical-alignment-006-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-bottom' and vertical-lr writing-mode
<ul class="assert">
@ -4902,10 +4968,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-008-7.5" class="primary ahem">
<tr id="vertical-alignment-008-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-008.htm">vertical-alignment-new-008</a></strong></td>
<td><a href="reference/vertical-alignment-new-008-ref.htm">=</a> </td>
<a href="vertical-alignment-008.htm">vertical-alignment-008</a></strong></td>
<td><a href="reference/vertical-alignment-008-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'bottom' and vertical-rl writing-mode
<ul class="assert">
@ -4913,10 +4979,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-009-7.5" class="primary ahem">
<tr id="vertical-alignment-009-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-009.htm">vertical-alignment-new-009</a></strong></td>
<td><a href="reference/vertical-alignment-new-008-ref.htm">=</a> </td>
<a href="vertical-alignment-009.htm">vertical-alignment-009</a></strong></td>
<td><a href="reference/vertical-alignment-008-ref.htm">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'bottom' and vertical-lr writing-mode
<ul class="assert">

33
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/bidi-004-ref.htm Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
<meta name="flags" content="ahem">
<style type="text/css">
div p { width: 28em; border: solid; margin: 1em; padding: 0.5em; background: #FFFFCC; color: black; font: 1em/1 Ahem; }
.control { line-height: 3em; }
.control.start { border-style: solid none solid solid; padding: 0.4em 0 0.4em 1em; }
.control.middle { border-style: solid none solid none; padding: 0.4em 0 0.4em 0; }
.control.end { border-style: solid solid solid none; padding: 0.4em 1em 0.4em 0; }
.a { color: navy; }
.b { color: orange; }
</style>
</head>
<body>
<p> The following two blocks should be identical, including overflow. (Force bidi: א) </p>
<div>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
</div>
</body>
</html>

5
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-new-002-ref.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-002-ref.htm
View file

@ -3,6 +3,7 @@
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<meta name="flags" content="image">
<style type="text/css">
img
@ -17,7 +18,7 @@
img#orange
{
padding-left: 120px; /* = the position of orange square */
margin-top: 30px;
}
</style>
@ -29,7 +30,7 @@
<p>Test passes if the right edge of an blue square is aligned with the left edge of a orange square.</p>
<div>
<img id="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled"><br><!--
<img id="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled"><!--
--><img id="orange" src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled">
</div>

7
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-new-004-ref.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-004-ref.htm
View file

@ -3,6 +3,7 @@
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-01 -->
<meta name="flags" content="image">
<style type="text/css">
img
@ -12,13 +13,9 @@
img
{
padding-left: 60px; /* = the position of first orange square */
padding-left: 60px; /* = position of orange squares */
}
img + br + img
{
padding-left: 60px; /* = the position of second orange square*/
}
</style>
</head>

7
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-new-006-ref.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-006-ref.htm
View file

@ -3,6 +3,7 @@
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<meta name="flags" content="image">
<style type="text/css">
img
@ -12,12 +13,12 @@
img
{
padding-left: 15px; /* = the position of first orange square */
padding-left: 60px; /* = the position of first orange square */
}
img + br + img
{
padding-left: 15px; /* = the position of second orange square*/
padding-left: 90px; /* = the position of second orange square*/
}
</style>
@ -25,7 +26,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div>
<img src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled"><br><!--

27
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-008-ref.htm Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<meta name="flags" content="image">
<style type="text/css">
img#orange
{
padding-left: 30px;
}
</style>
</head>
<body>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div>
<img id="orange" src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled"><!--
--><img src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled">
</div>
</body>
</html>

31
tests/wpt/css-tests/css-writing-modes-3_dev/html/reference/vertical-alignment-new-008-ref.htm
View file

@ -1,31 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<meta name="flags" content="image">
<style type="text/css">
img
{
vertical-align: top;
}
img#orange
{
padding-top: 60px; /* = the height of first character */
}
</style>
</head>
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<div>
<img src="support/swatch-blue.png" width="120" height="120" alt="Image download support must be enabled"><!--
--><img id="orange" src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled">
</div>
</body>
</html>

56
tests/wpt/css-tests/css-writing-modes-3_dev/html/reftest-toc.htm
View file

@ -2208,6 +2208,14 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="bidi-004" class="ahem may21">
<tr>
<td rowspan="1" title="The bidi algorithm and inlines in CSS">
<a href="bidi-004.htm">bidi-004</a></td>
<td><a href="reference/bidi-004-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="may21" title="Behavior tested is preferred but optional">Optional</abbr></td>
</tr>
</tbody>
<tbody id="bidi-011" class="">
<tr>
<td rowspan="1" title="The bidi algorithm and inlines in CSS wrapping bidi formatting characters">
@ -5752,67 +5760,67 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-002" class="ahem">
<tbody id="vertical-alignment-002" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'top' and vertical-rl writing-mode">
<a href="vertical-alignment-new-002.htm">vertical-alignment-new-002</a></td>
<td><a href="reference/vertical-alignment-new-002-ref.htm">=</a> </td>
<a href="vertical-alignment-002.htm">vertical-alignment-002</a></td>
<td><a href="reference/vertical-alignment-002-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-003" class="ahem">
<tbody id="vertical-alignment-003" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'top' and vertical-lr writing-mode">
<a href="vertical-alignment-new-003.htm">vertical-alignment-new-003</a></td>
<td><a href="reference/vertical-alignment-new-002-ref.htm">=</a> </td>
<a href="vertical-alignment-003.htm">vertical-alignment-003</a></td>
<td><a href="reference/vertical-alignment-002-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-004" class="ahem">
<tbody id="vertical-alignment-004" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-top' and vertical-rl writing-mode">
<a href="vertical-alignment-new-004.htm">vertical-alignment-new-004</a></td>
<td><a href="reference/vertical-alignment-new-004-ref.htm">=</a> </td>
<a href="vertical-alignment-004.htm">vertical-alignment-004</a></td>
<td><a href="reference/vertical-alignment-004-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-005" class="ahem">
<tbody id="vertical-alignment-005" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-top' and vertical-lr writing-mode">
<a href="vertical-alignment-new-005.htm">vertical-alignment-new-005</a></td>
<td><a href="reference/vertical-alignment-new-004-ref.htm">=</a> </td>
<a href="vertical-alignment-005.htm">vertical-alignment-005</a></td>
<td><a href="reference/vertical-alignment-004-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-006" class="ahem">
<tbody id="vertical-alignment-006" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-bottom' and vertical-rl writing-mode">
<a href="vertical-alignment-new-006.htm">vertical-alignment-new-006</a></td>
<td><a href="reference/vertical-alignment-new-006-ref.htm">=</a> </td>
<a href="vertical-alignment-006.htm">vertical-alignment-006</a></td>
<td><a href="reference/vertical-alignment-006-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-007" class="ahem">
<tbody id="vertical-alignment-007" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-bottom' and vertical-lr writing-mode">
<a href="vertical-alignment-new-007.htm">vertical-alignment-new-007</a></td>
<td><a href="reference/vertical-alignment-new-006-ref.htm">=</a> </td>
<a href="vertical-alignment-007.htm">vertical-alignment-007</a></td>
<td><a href="reference/vertical-alignment-006-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-008" class="ahem">
<tbody id="vertical-alignment-008" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'bottom' and vertical-rl writing-mode">
<a href="vertical-alignment-new-008.htm">vertical-alignment-new-008</a></td>
<td><a href="reference/vertical-alignment-new-008-ref.htm">=</a> </td>
<a href="vertical-alignment-008.htm">vertical-alignment-008</a></td>
<td><a href="reference/vertical-alignment-008-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-009" class="ahem">
<tbody id="vertical-alignment-009" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'bottom' and vertical-lr writing-mode">
<a href="vertical-alignment-new-009.htm">vertical-alignment-new-009</a></td>
<td><a href="reference/vertical-alignment-new-008-ref.htm">=</a> </td>
<a href="vertical-alignment-009.htm">vertical-alignment-009</a></td>
<td><a href="reference/vertical-alignment-008-ref.htm">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>

17
tests/wpt/css-tests/css-writing-modes-3_dev/html/reftest.list
View file

@ -272,6 +272,7 @@ baseline-inline-replaced-003.htm == reference/baseline-inline-replaced-002-ref.h
bidi-001.htm == reference/bidi-001-ref.htm
bidi-002.htm == reference/bidi-002-ref.htm
bidi-003.htm == reference/bidi-003-ref.htm
bidi-004.htm == reference/bidi-004-ref.htm
bidi-011.htm == reference/bidi-011-ref.htm
bidi-box-model-001.htm == reference/bidi-box-model-001-ref.htm
bidi-box-model-002.htm == reference/bidi-box-model-001-ref.htm
@ -715,14 +716,14 @@ unicode-bidi-applies-to-012.htm == reference/direction-applies-to-008-ref.htm
unicode-bidi-applies-to-013.htm == reference/direction-applies-to-008-ref.htm
unicode-bidi-applies-to-014.htm == reference/direction-applies-to-008-ref.htm
unicode-bidi-applies-to-015.htm == reference/direction-applies-to-008-ref.htm
vertical-alignment-new-002.htm == reference/vertical-alignment-new-002-ref.htm
vertical-alignment-new-003.htm == reference/vertical-alignment-new-002-ref.htm
vertical-alignment-new-004.htm == reference/vertical-alignment-new-004-ref.htm
vertical-alignment-new-005.htm == reference/vertical-alignment-new-004-ref.htm
vertical-alignment-new-006.htm == reference/vertical-alignment-new-006-ref.htm
vertical-alignment-new-007.htm == reference/vertical-alignment-new-006-ref.htm
vertical-alignment-new-008.htm == reference/vertical-alignment-new-008-ref.htm
vertical-alignment-new-009.htm == reference/vertical-alignment-new-008-ref.htm
vertical-alignment-002.htm == reference/vertical-alignment-002-ref.htm
vertical-alignment-003.htm == reference/vertical-alignment-002-ref.htm
vertical-alignment-004.htm == reference/vertical-alignment-004-ref.htm
vertical-alignment-005.htm == reference/vertical-alignment-004-ref.htm
vertical-alignment-006.htm == reference/vertical-alignment-006-ref.htm
vertical-alignment-007.htm == reference/vertical-alignment-006-ref.htm
vertical-alignment-008.htm == reference/vertical-alignment-008-ref.htm
vertical-alignment-009.htm == reference/vertical-alignment-008-ref.htm
writing-mode-horizontal-001l.htm == reference/writing-mode-horizontal-001l-ref.htm
writing-mode-horizontal-001r.htm == reference/writing-mode-horizontal-001r-ref.htm
writing-mode-stretch-001.htm == reference/writing-mode-stretch-001-ref.htm

6
tests/wpt/css-tests/css-writing-modes-3_dev/html/toc.htm
View file

@ -27,7 +27,7 @@
<tbody id="s2">
<tr><th><a href="chapter-2.htm">Chapter 2 -
Inline Direction and Bidirectionality</a></th>
<td>(162 Tests)</td></tr>
<td>(163 Tests)</td></tr>
</tbody>
<tbody id="s3">
<tr><th><a href="chapter-3.htm">Chapter 3 -
@ -37,7 +37,7 @@
<tbody id="s4">
<tr><th><a href="chapter-4.htm">Chapter 4 -
Inline-level Alignment</a></th>
<td>(70 Tests)</td></tr>
<td>(38 Tests)</td></tr>
</tbody>
<tbody id="s5">
<tr><th><a href="chapter-5.htm">Chapter 5 -
@ -52,7 +52,7 @@
<tbody id="s7">
<tr><th><a href="chapter-7.htm">Chapter 7 -
Abstract Box Layout</a></th>
<td>(489 Tests)</td></tr>
<td>(495 Tests)</td></tr>
</tbody>
<tbody id="s8">
<tr><th><a href="chapter-8.htm">Chapter 8 -

49
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-font-size-vlr-003.htm Normal file
View file

@ -0,0 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<link rel="bookmark" href="http://www.w3.org/TR/css-text-decor-3/leftline-cross.png" title="">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn">ᠨ<span id="larger">ᠨᠨ</span>ᠨ</span></span></div>
</body>
</html>

48
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-font-size-vlr-005.htm Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn">ᠨ<span id="larger" lang="en">AB</span>ᠨ</span></span></div>
</body>
</html>

49
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-font-size-vrl-002.htm Normal file
View file

@ -0,0 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<link rel="bookmark" href="http://www.w3.org/TR/css-text-decor-3/leftline-cross.png" title="">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja">方<span id="larger">方方</span>方</span></span></div>
</body>
</html>

48
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-font-size-vrl-004.htm Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja">方<span id="larger" lang="en">AB</span>方</span></span></div>
</body>
</html>

43
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-mixed-vlr-003.htm Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn">ᠨ<span lang="en">AB</span>ᠨ</span></span></div>
</body>
</html>

43
tests/wpt/css-tests/css-writing-modes-3_dev/html/underline-mixed-vrl-002.htm Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>CSS Writing Modes Test: 'text-decoration: underline' and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings">
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property">
<meta content="" name="flags">
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text." name="assert">
<style type="text/css">
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja">方<span lang="en">AB</span>方</span></span></div>
</body>
</html>

4
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-002.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-002.htm
View file

@ -3,10 +3,11 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.">
<link rel="match" href="reference/vertical-alignment-new-002-ref.htm">
<link rel="match" href="reference/vertical-alignment-002-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#rl
@ -21,6 +22,7 @@
font-size: 0.5em;
color: orange;
vertical-align: top;
margin-top: -1em;
}
</style>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-002a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'baseline' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-002b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'baseline' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

11
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-003.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-003.htm
View file

@ -3,25 +3,26 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.">
<link rel="match" href="reference/vertical-alignment-new-002-ref.htm">
<link rel="match" href="reference/vertical-alignment-002-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#lr
{
border-right: blue solid 2em;
writing-mode: vertical-lr;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: top;
line-height: 1;
margin-top: -1em;
}
</style>
@ -29,7 +30,7 @@
<body>
<p>Test passes if the right edge of an orange square touches the left edge of a blue square.</p>
<p>Test passes if the right edge of an blue square is aligned with the left edge of a orange square.</p>
<div id="lr">A<span id="orange">O</span></div>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-003a.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'baseline' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-003b.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'baseline' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

5
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-004.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-004.htm
View file

@ -3,16 +3,17 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'text-top' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-01 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.">
<link rel="match" href="reference/vertical-alignment-new-004-ref.htm">
<link rel="match" href="reference/vertical-alignment-004-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#rl
{
color: orange;
font: 3.75em/3 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-rl;
}

8
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-005.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-005.htm
View file

@ -3,16 +3,17 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'text-top' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.">
<link rel="match" href="reference/vertical-alignment-new-004-ref.htm">
<link rel="match" href="reference/vertical-alignment-004-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#lr
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-lr;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-top;
line-height: 1;
}
</style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="lr">A<span id="orange30">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-005a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'sub' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: sub;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-005b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'sub' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: sub;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

8
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-006.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-006.htm
View file

@ -3,16 +3,17 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'text-bottom' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.">
<link rel="match" href="reference/vertical-alignment-new-006-ref.htm">
<link rel="match" href="reference/vertical-alignment-006-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#rl
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-rl;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-bottom;
line-height: 1;
}
</style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="rl">A<span id="orange30">O</span></div>

8
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-007.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-007.htm
View file

@ -3,16 +3,17 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'text-bottom' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.">
<link rel="match" href="reference/vertical-alignment-new-006-ref.htm">
<link rel="match" href="reference/vertical-alignment-006-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#lr
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-lr;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-bottom;
line-height: 1;
}
</style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="lr">A<span id="orange30">O</span></div>

11
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-008.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-008.htm
View file

@ -3,25 +3,26 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'bottom' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.">
<link rel="match" href="reference/vertical-alignment-new-008-ref.htm">
<link rel="match" href="reference/vertical-alignment-008-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#rl
{
border-left: blue solid 2em;
writing-mode: vertical-rl;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: bottom;
line-height: 1;
margin-top: -1em;
}
</style>
@ -30,7 +31,7 @@
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div id="rl">A<span id="orange">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-008a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'super' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: super;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-008b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'super' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: super;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

11
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-new-009.htm → tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-009.htm
View file

@ -3,25 +3,26 @@
<head>
<title>CSS Writing Modes Test: vertical-align - 'bottom' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading">
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.">
<link rel="match" href="reference/vertical-alignment-new-008-ref.htm">
<link rel="match" href="reference/vertical-alignment-008-ref.htm">
<meta name="flags" content="ahem">
<style type="text/css">
div#lr
{
border-left: blue solid 2em;
writing-mode: vertical-lr;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: bottom;
line-height: 1;
margin-top: -1em;
}
</style>
@ -30,7 +31,7 @@
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div id="lr">A<span id="orange">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-011a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-011b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-012l.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-012r.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-014a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
margin-top: 1em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0.8em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-014b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
margin-top: 1em;
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0.8em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-015a.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive length (0.5em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0.5em;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-015b.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive length (0.5em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0.5em;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

68
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-017a.htm
View file

@ -1,68 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
padding-right: 0.2em;
margin-top: 1em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -0.2em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

68
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-017b.htm
View file

@ -1,68 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
margin-top: 1em;
padding-left: 0.2em;
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -0.2em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-018a.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -0.5em;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-018b.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -0.5em;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-020a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-020b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="image">
<style type="text/css">
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-021a.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero percentage (0%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-021b.htm
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'zero percentage (0%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-023a.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
margin-top: 1em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 80%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-023b.htm
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive percentage (80%)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
margin-top: 1em;
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 80%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-024a.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive percentage (50%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 50%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-024b.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'positive percentage (50%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 50%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

68
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-026a.htm
View file

@ -1,68 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative percentage (-20%)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
padding-right: 0.2em;
margin-top: 1em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -20%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>right</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">SIDEL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

68
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-026b.htm
View file

@ -1,68 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative length (-20%)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
margin-top: 1em;
padding-left: 0.2em;
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -20%;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="sideways">SIDEW
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">SIDER
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-027a.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -50%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

64
tests/wpt/css-tests/css-writing-modes-3_dev/html/vertical-alignment-027b.htm
View file

@ -1,64 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Writing Modes Test: vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com">
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height">
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.">
<meta name="flags" content="ahem image">
<style type="text/css">
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: -50%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
</style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed">MIXED
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="upright">UPRIG
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
<p class="use-glyph-orientation">USEGL
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled">
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled">
</p>
</div>
</body>
</html>

114
tests/wpt/css-tests/css-writing-modes-3_dev/implementation-report-TEMPLATE.data
View file

@ -581,6 +581,8 @@ html/bidi-002.htm 48d2d4ba08ef8b06d14ef353e9fb8caa30bb43af ?
xhtml1/bidi-002.xht 48d2d4ba08ef8b06d14ef353e9fb8caa30bb43af ?
html/bidi-003.htm 4fc2169d7f75864298bca1a48c3d4d3bdb3560cf ?
xhtml1/bidi-003.xht 4fc2169d7f75864298bca1a48c3d4d3bdb3560cf ?
html/bidi-004.htm e49d44d9a5a48b452d89967dd44efdb7e4c713c0 ?
xhtml1/bidi-004.xht e49d44d9a5a48b452d89967dd44efdb7e4c713c0 ?
html/bidi-005.htm 9a94108988b0d806f23f5d63aec2a5b34d6aea05 ?
xhtml1/bidi-005.xht 9a94108988b0d806f23f5d63aec2a5b34d6aea05 ?
html/bidi-006.htm a699b5134869e68b68c5399f9be53865f6bb90cd ?
@ -1049,8 +1051,8 @@ html/extract-ordered-list-direction-and-writing-modes.htm f456a08de75932c3881a76
xhtml1/extract-ordered-list-direction-and-writing-modes.xht f456a08de75932c3881a76490ed2fdb7211d2bc8 ?
html/first-page-vlr-003.htm ba9f62a92fda53555211ee1de1a17cb08e124dd6 ?
xhtml1/first-page-vlr-003.xht ba9f62a92fda53555211ee1de1a17cb08e124dd6 ?
html/first-page-vrl-002.htm 0e3999276064df4aff359983d7a6cb2977a7a19b ?
xhtml1/first-page-vrl-002.xht 0e3999276064df4aff359983d7a6cb2977a7a19b ?
html/first-page-vrl-002.htm d889dab856e4fad4d820153f78921a043b28589d ?
xhtml1/first-page-vrl-002.xht d889dab856e4fad4d820153f78921a043b28589d ?
html/flexbox-writing-mode-007.htm 0557a81af23da4d969bce70f840968a7d5947006 ?
xhtml1/flexbox-writing-mode-007.xht 0557a81af23da4d969bce70f840968a7d5947006 ?
html/flexbox-writing-mode-008.htm aaac3dcddfec40e5c67ae479e0df2184ddec82d2 ?
@ -1625,6 +1627,18 @@ html/text-orientation-sideways-right-001.htm 0553269d79d31412d44b0b586a2711298ed
xhtml1/text-orientation-sideways-right-001.xht 0553269d79d31412d44b0b586a2711298ed43b7f ?
html/text-orientation-upright-001.htm c2881506193c25b132f0d88c5ad2a8d1c53e37b6 ?
xhtml1/text-orientation-upright-001.xht c2881506193c25b132f0d88c5ad2a8d1c53e37b6 ?
html/underline-font-size-vlr-003.htm 05a00f9e67ec770a68184f514da16d42f3664b4e ?
xhtml1/underline-font-size-vlr-003.xht 05a00f9e67ec770a68184f514da16d42f3664b4e ?
html/underline-font-size-vlr-005.htm cf494cde416df9487dabe224857d7c09849b13a7 ?
xhtml1/underline-font-size-vlr-005.xht cf494cde416df9487dabe224857d7c09849b13a7 ?
html/underline-font-size-vrl-002.htm fde426aff2dd0f2666881af719f8a933595db5e5 ?
xhtml1/underline-font-size-vrl-002.xht fde426aff2dd0f2666881af719f8a933595db5e5 ?
html/underline-font-size-vrl-004.htm b37f8604be0f98e2fb03f2f2198170017232ece1 ?
xhtml1/underline-font-size-vrl-004.xht b37f8604be0f98e2fb03f2f2198170017232ece1 ?
html/underline-mixed-vlr-003.htm ffd107c6592a7876badaee2070b4aac10886bbc3 ?
xhtml1/underline-mixed-vlr-003.xht ffd107c6592a7876badaee2070b4aac10886bbc3 ?
html/underline-mixed-vrl-002.htm 233697bcbc7031e4901fe8df986802a06698c850 ?
xhtml1/underline-mixed-vrl-002.xht 233697bcbc7031e4901fe8df986802a06698c850 ?
html/unicode-bidi-001.htm 23dd56a09e50c8f068ed78bfbec09343f4189224 ?
xhtml1/unicode-bidi-001.xht 23dd56a09e50c8f068ed78bfbec09343f4189224 ?
html/unicode-bidi-002.htm 4b27955dff5183c9c707ec654c50ab0d5c9509f4 ?
@ -1661,86 +1675,22 @@ html/unicode-bidi-applies-to-014.htm 1ea78d913a72bdf534c9701bc8a771df856e3d2f ?
xhtml1/unicode-bidi-applies-to-014.xht 1ea78d913a72bdf534c9701bc8a771df856e3d2f ?
html/unicode-bidi-applies-to-015.htm f319b3e86aea3385f390f78d56ba608a6ac94f27 ?
xhtml1/unicode-bidi-applies-to-015.xht f319b3e86aea3385f390f78d56ba608a6ac94f27 ?
html/vertical-alignment-002a.htm a55994c93e6652bdc61229154fe73727bd2c9aea ?
xhtml1/vertical-alignment-002a.xht a55994c93e6652bdc61229154fe73727bd2c9aea ?
html/vertical-alignment-002b.htm 779a3696b7909f11787ad979d92c965675b8ed71 ?
xhtml1/vertical-alignment-002b.xht 779a3696b7909f11787ad979d92c965675b8ed71 ?
html/vertical-alignment-003a.htm 66706a353742efd4400d64575c633bb17a2a7252 ?
xhtml1/vertical-alignment-003a.xht 66706a353742efd4400d64575c633bb17a2a7252 ?
html/vertical-alignment-003b.htm c28364f9b1f41b8538e624119234b1d35d6c6091 ?
xhtml1/vertical-alignment-003b.xht c28364f9b1f41b8538e624119234b1d35d6c6091 ?
html/vertical-alignment-005a.htm 2df8dff5be7453c111fb9364ef9d796a91095b3a ?
xhtml1/vertical-alignment-005a.xht 2df8dff5be7453c111fb9364ef9d796a91095b3a ?
html/vertical-alignment-005b.htm 2fc7c00892fc1d5860633a96bba4ba7878ad7004 ?
xhtml1/vertical-alignment-005b.xht 2fc7c00892fc1d5860633a96bba4ba7878ad7004 ?
html/vertical-alignment-008a.htm 9dc8848f9db104ed33e3001e946369278588df9c ?
xhtml1/vertical-alignment-008a.xht 9dc8848f9db104ed33e3001e946369278588df9c ?
html/vertical-alignment-008b.htm 7de9f0763dbb93b0f55dceb7b80116c87ad800df ?
xhtml1/vertical-alignment-008b.xht 7de9f0763dbb93b0f55dceb7b80116c87ad800df ?
html/vertical-alignment-011a.htm e3c5648ce732c30881a84fb5a0a8083191332a56 ?
xhtml1/vertical-alignment-011a.xht e3c5648ce732c30881a84fb5a0a8083191332a56 ?
html/vertical-alignment-011b.htm 724bbb86a2b9ec3bd9252fec92cacd6212775175 ?
xhtml1/vertical-alignment-011b.xht 724bbb86a2b9ec3bd9252fec92cacd6212775175 ?
html/vertical-alignment-012l.htm 1684f5ad59fd0c5ce9f9d3190bf569388b3557ba ?
xhtml1/vertical-alignment-012l.xht 1684f5ad59fd0c5ce9f9d3190bf569388b3557ba ?
html/vertical-alignment-012r.htm dcd288dd395eea47285230ca20aa83dd6c874f17 ?
xhtml1/vertical-alignment-012r.xht dcd288dd395eea47285230ca20aa83dd6c874f17 ?
html/vertical-alignment-014a.htm 199a8e04915d4e564618ef120bf32e5c568cafc0 ?
xhtml1/vertical-alignment-014a.xht 199a8e04915d4e564618ef120bf32e5c568cafc0 ?
html/vertical-alignment-014b.htm 755eb3f5800991c4d7df16dc70d2aaf30e419c42 ?
xhtml1/vertical-alignment-014b.xht 755eb3f5800991c4d7df16dc70d2aaf30e419c42 ?
html/vertical-alignment-015a.htm 32b2362ace97e299f7beaa3aac8d3323837c7fc8 ?
xhtml1/vertical-alignment-015a.xht 32b2362ace97e299f7beaa3aac8d3323837c7fc8 ?
html/vertical-alignment-015b.htm f059163e577bcbadccf1e2912c2c8724777930c2 ?
xhtml1/vertical-alignment-015b.xht f059163e577bcbadccf1e2912c2c8724777930c2 ?
html/vertical-alignment-017a.htm 83b231bd5ad62e4e981f504bedbe7bfde444335d ?
xhtml1/vertical-alignment-017a.xht 83b231bd5ad62e4e981f504bedbe7bfde444335d ?
html/vertical-alignment-017b.htm 20354412b9971eb45aafda4db62c290f6a2b1602 ?
xhtml1/vertical-alignment-017b.xht 20354412b9971eb45aafda4db62c290f6a2b1602 ?
html/vertical-alignment-018a.htm 7cc30a291d2c69b03bd4179951b87c58e2a02ccb ?
xhtml1/vertical-alignment-018a.xht 7cc30a291d2c69b03bd4179951b87c58e2a02ccb ?
html/vertical-alignment-018b.htm bda9934745cc38f21bcb4235eac2d5824d849f9f ?
xhtml1/vertical-alignment-018b.xht bda9934745cc38f21bcb4235eac2d5824d849f9f ?
html/vertical-alignment-020a.htm 6533d451114b23d657e6bbc8362390a1c4aaf1eb ?
xhtml1/vertical-alignment-020a.xht 6533d451114b23d657e6bbc8362390a1c4aaf1eb ?
html/vertical-alignment-020b.htm 7b7ff221754d9c3bc955380e044413ccfbf7ee8b ?
xhtml1/vertical-alignment-020b.xht 7b7ff221754d9c3bc955380e044413ccfbf7ee8b ?
html/vertical-alignment-021a.htm 9ddfeee8aeba9e1241ce506ec75af1ba37f6ef06 ?
xhtml1/vertical-alignment-021a.xht 9ddfeee8aeba9e1241ce506ec75af1ba37f6ef06 ?
html/vertical-alignment-021b.htm 0e68e5e6821c0645ff08d40eb02e7ddd87d99caf ?
xhtml1/vertical-alignment-021b.xht 0e68e5e6821c0645ff08d40eb02e7ddd87d99caf ?
html/vertical-alignment-023a.htm d42792f46d6c5d9052eaf7ed1c7981d3968fdc07 ?
xhtml1/vertical-alignment-023a.xht d42792f46d6c5d9052eaf7ed1c7981d3968fdc07 ?
html/vertical-alignment-023b.htm a13b1e018382f0e99499b691e9cbbe8f2bcfb740 ?
xhtml1/vertical-alignment-023b.xht a13b1e018382f0e99499b691e9cbbe8f2bcfb740 ?
html/vertical-alignment-024a.htm 339511c5b7a5eef6400b44a7cb6403adebe16ae0 ?
xhtml1/vertical-alignment-024a.xht 339511c5b7a5eef6400b44a7cb6403adebe16ae0 ?
html/vertical-alignment-024b.htm d6cc4618d830dfb7a86b471d7b149546f7721bd4 ?
xhtml1/vertical-alignment-024b.xht d6cc4618d830dfb7a86b471d7b149546f7721bd4 ?
html/vertical-alignment-026a.htm 777a16060504fa5c1a2c649279ee6dbcb56729ad ?
xhtml1/vertical-alignment-026a.xht 777a16060504fa5c1a2c649279ee6dbcb56729ad ?
html/vertical-alignment-026b.htm fb3d8d2c8ec17a80bc05d9cf6027855dab6b9836 ?
xhtml1/vertical-alignment-026b.xht fb3d8d2c8ec17a80bc05d9cf6027855dab6b9836 ?
html/vertical-alignment-027a.htm ca2c37b2acc7a2be0e438b5069acd2286487b6ab ?
xhtml1/vertical-alignment-027a.xht ca2c37b2acc7a2be0e438b5069acd2286487b6ab ?
html/vertical-alignment-027b.htm eb3ef979b26f31507a2f72ba374274fd22113364 ?
xhtml1/vertical-alignment-027b.xht eb3ef979b26f31507a2f72ba374274fd22113364 ?
html/vertical-alignment-new-002.htm 515da3806b29df524807102d2a3a278cd8ee89b7 ?
xhtml1/vertical-alignment-new-002.xht 515da3806b29df524807102d2a3a278cd8ee89b7 ?
html/vertical-alignment-new-003.htm d8711ff67efb10fec65c3cd87238a69f94a4b85d ?
xhtml1/vertical-alignment-new-003.xht d8711ff67efb10fec65c3cd87238a69f94a4b85d ?
html/vertical-alignment-new-004.htm 234bc9d84450e317b1b9243cda9b0f9a261b360d ?
xhtml1/vertical-alignment-new-004.xht 234bc9d84450e317b1b9243cda9b0f9a261b360d ?
html/vertical-alignment-new-005.htm eca0b3cf343e86cc7ec5c08969adfd7b603ed51a ?
xhtml1/vertical-alignment-new-005.xht eca0b3cf343e86cc7ec5c08969adfd7b603ed51a ?
html/vertical-alignment-new-006.htm 61e9e28954d65bb677c10c1ecabe02697a4be616 ?
xhtml1/vertical-alignment-new-006.xht 61e9e28954d65bb677c10c1ecabe02697a4be616 ?
html/vertical-alignment-new-007.htm b8f4194fc311ebd51130715a3947c69f63e3c21b ?
xhtml1/vertical-alignment-new-007.xht b8f4194fc311ebd51130715a3947c69f63e3c21b ?
html/vertical-alignment-new-008.htm 73e2f80c8ee8ddd097b71d7b07b9b886e5895f0f ?
xhtml1/vertical-alignment-new-008.xht 73e2f80c8ee8ddd097b71d7b07b9b886e5895f0f ?
html/vertical-alignment-new-009.htm aa74713244d8619cc17b458de1eba22f22f87c5a ?
xhtml1/vertical-alignment-new-009.xht aa74713244d8619cc17b458de1eba22f22f87c5a ?
html/vertical-alignment-002.htm 4c53752f7cb914db7dbaaa14f288b68bf309a007 ?
xhtml1/vertical-alignment-002.xht 4c53752f7cb914db7dbaaa14f288b68bf309a007 ?
html/vertical-alignment-003.htm 1026d4c787262714d3f0a446435d77f99dd791ff ?
xhtml1/vertical-alignment-003.xht 1026d4c787262714d3f0a446435d77f99dd791ff ?
html/vertical-alignment-004.htm 5a5453f032ae0dc73575f7a1b1cda98f702e4cbd ?
xhtml1/vertical-alignment-004.xht 5a5453f032ae0dc73575f7a1b1cda98f702e4cbd ?
html/vertical-alignment-005.htm dd1d34eeed4dc29947946f23c1bb33a52c137a6b ?
xhtml1/vertical-alignment-005.xht dd1d34eeed4dc29947946f23c1bb33a52c137a6b ?
html/vertical-alignment-006.htm ebaa202f68415b725ed9b57425d6dfc4143e8c84 ?
xhtml1/vertical-alignment-006.xht ebaa202f68415b725ed9b57425d6dfc4143e8c84 ?
html/vertical-alignment-007.htm 5a6fc29d4ee3bd782a04c4e118b53801e5c8eb3b ?
xhtml1/vertical-alignment-007.xht 5a6fc29d4ee3bd782a04c4e118b53801e5c8eb3b ?
html/vertical-alignment-008.htm fea0050dbf199c607d6a17263f4b49d0303bdc50 ?
xhtml1/vertical-alignment-008.xht fea0050dbf199c607d6a17263f4b49d0303bdc50 ?
html/vertical-alignment-009.htm 17c24fd05a1e0b837b6e65096f068bebd6108b19 ?
xhtml1/vertical-alignment-009.xht 17c24fd05a1e0b837b6e65096f068bebd6108b19 ?
html/writing-mode-horizontal-001l.htm 820b6baaa9ff63cf1a29b989c8d68ebdafe3c4da ?
xhtml1/writing-mode-horizontal-001l.xht 820b6baaa9ff63cf1a29b989c8d68ebdafe3c4da ?
html/writing-mode-horizontal-001r.htm 946a8be6f47e1cdc7ca7539e48e9964bd77c9ba9 ?

57
tests/wpt/css-tests/css-writing-modes-3_dev/testinfo.data
View file

@ -288,6 +288,7 @@ baseline-inline-replaced-003 reference/baseline-inline-replaced-002-ref baseline
bidi-001 reference/bidi-001-ref RLO/PDF bidi reordering across closing inline element boundary http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://www.w3.org/TR/CSS21/text.html#white-space-model,http://unicode.org/reports/tr9/ 4b17669682a01af35c7ff859a56ff14979004532 `Ian Hickson`<mailto:ian@hixie.ch> Tests that RLO + closing inline element boundary + PDF reorders text, splitting inline and rendering borders and padding appropriately.
bidi-002 reference/bidi-002-ref RLO/PDF bidi reordering across closing inline element boundary + soft line break http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://unicode.org/reports/tr9/ 48d2d4ba08ef8b06d14ef353e9fb8caa30bb43af `Ian Hickson`<mailto:ian@hixie.ch> Tests that RLO + closing inline element boundary + soft line break + PDF reorders text, placing text correctly on each line while also splitting inline and rendering borders and padding appropriately.
bidi-003 reference/bidi-003-ref RLO/PDF bidi reordering across closing inline element boundary + opening inline boundary http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://www.w3.org/TR/CSS21/text.html#white-space-model,http://unicode.org/reports/tr9/ 4fc2169d7f75864298bca1a48c3d4d3bdb3560cf `Ian Hickson`<mailto:ian@hixie.ch> Tests that RLO + closing inline element boundary + opening inline element boundary + PDF reorders text, splitting inlines and rendering their borders and padding appropriately.
bidi-004 reference/bidi-004-ref The bidi algorithm and inlines in CSS ahem,may21 http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-text-3/#white-space-rules,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://www.w3.org/TR/CSS21/text.html#white-space-model,http://unicode.org/reports/tr9/,http://www.w3.org/TR/html5/rendering.html#phrasing-content-0 e49d44d9a5a48b452d89967dd44efdb7e4c713c0 `Ian Hickson`<mailto:ian@hixie.ch>
bidi-005 The bidi algorithm and inlines in CSS: embed levels and white-space: pre; http://www.w3.org/TR/css-text-3/#letter-spacing-property,http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://unicode.org/reports/tr9/ 9a94108988b0d806f23f5d63aec2a5b34d6aea05 `Ian Hickson`<mailto:ian@hixie.ch>
bidi-006 The bidi algorithm and inlines in CSS: embed levels and white-space: nowrap; http://www.w3.org/TR/css-text-3/#letter-spacing-property,http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://unicode.org/reports/tr9/ a699b5134869e68b68c5399f9be53865f6bb90cd `Ian Hickson`<mailto:ian@hixie.ch>
bidi-007 The bidi algorithm and inlines in CSS: embed levels and float: left; http://www.w3.org/TR/css-text-3/#letter-spacing-property,http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model,http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes,http://www.w3.org/TR/CSS21/box.html#bidi-box-model,http://www.w3.org/TR/CSS21/visuren.html#direction,http://unicode.org/reports/tr9/ 52cbe1038400d33a001f042c6b78f1ee216c902b `Ian Hickson`<mailto:ian@hixie.ch>
@ -522,7 +523,7 @@ direction-vrl-002 reference/direction-vrl-002-ref 'vertical-rl' and 'direction:
direction-vrl-004 reference/direction-vrl-004-ref 'vertical-rl' and 'direction: ltr' ahem,image http://www.w3.org/TR/css-writing-modes-3/#logical-directions 31d81702696bd0c7fe90ce7f4b6a91947db9234f `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when a block box has 'direction' set to 'ltr' in a vertical writing-mode, then inlines boxes are aligned from line-left to line-right.
extract-ordered-list-direction-and-writing-modes reference/extract-ordered-list-direction-and-writing-modes-ref flow-into on list items that use different text directions or writing modes http://www.w3.org/TR/css3-regions/#properties,http://www.w3.org/TR/css3-regions/#the-flow-into-property,http://www.w3.org/TR/css-writing-modes-3/#direction,http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode f456a08de75932c3881a76490ed2fdb7211d2bc8 `Mihai Balan`<mibalan@adobe.com> The flow-into property can be applied to elements that have different text directions and writing modes. This tests that the rendering for lists that use different text directions/writing modes are not affected when they are extracted in a named flow and rendered in a region.
first-page-vlr-003 first page of a document with vertical-lr writing-mode paged http://www.w3.org/TR/css-writing-modes-3/#writing-mode,http://www.w3.org/TR/CSS21/page.html#page-selectors ba9f62a92fda53555211ee1de1a17cb08e124dd6 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> 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.
first-page-vrl-002 first page of a document with vertical-rl writing-mode image,paged http://www.w3.org/TR/css-writing-modes-3/#writing-mode,http://www.w3.org/TR/CSS21/page.html#page-selectors 0e3999276064df4aff359983d7a6cb2977a7a19b `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> 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.
first-page-vrl-002 first page of a document with vertical-rl writing-mode image,paged http://www.w3.org/TR/css-writing-modes-3/#writing-mode,http://www.w3.org/TR/CSS21/page.html#page-selectors d889dab856e4fad4d820153f78921a043b28589d `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> 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.
flexbox-writing-mode-007 reference/flexbox-writing-mode-007-ref Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode http://www.w3.org/TR/css-flexbox-1/#layout-algorithm,http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode 0557a81af23da4d969bce70f840968a7d5947006 `Daniel Holbert`<mailto:dholbert@mozilla.com>
flexbox-writing-mode-008 reference/flexbox-writing-mode-008-ref Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode http://www.w3.org/TR/css-flexbox-1/#layout-algorithm,http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode aaac3dcddfec40e5c67ae479e0df2184ddec82d2 `Daniel Holbert`<mailto:dholbert@mozilla.com>
flexbox-writing-mode-009 reference/flexbox-writing-mode-009-ref Verify that explicit sizes are honored on flex items whose writing-mode may differ from the flex container's writing-mode http://www.w3.org/TR/css-flexbox-1/#layout-algorithm,http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode 931b9d02203e63cacec94a45b450d721c5222706 `Daniel Holbert`<mailto:dholbert@mozilla.com>
@ -810,6 +811,12 @@ text-orientation-sideways-002 text-orientation - sideways in vertical-lr writin
text-orientation-sideways-left-001 text-orientation - sideways-left in vertical-rl writing mode font,image http://www.w3.org/TR/css-writing-modes-3/#text-orientation 37efc584b582b3fe93de726057ddf69aa6544cf0 `Kazuaki Takemura`<mailto:takemura@networksoft.co.jp> This test checks that a general horizontal text(include Japanese,etc) rotated 90 degrees counter-clockwise, and it is verified whether the characters are aligned in the vertical direction.
text-orientation-sideways-right-001 text-orientation - sideways-right in vertical-rl writing mode font,image http://www.w3.org/TR/css-writing-modes-3/#text-orientation 0553269d79d31412d44b0b586a2711298ed43b7f `Kazuaki Takemura`<mailto:takemura@networksoft.co.jp> This test checks that general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction.
text-orientation-upright-001 text-orientation - upright in vertical-rl writing mode font,image http://www.w3.org/TR/css-writing-modes-3/#text-orientation c2881506193c25b132f0d88c5ad2a8d1c53e37b6 `Kazuaki Takemura`<mailto:takemura@networksoft.co.jp> This test checks that the alphabet is displayed on the upright (not sideways),and it is verified whether the characters are aligned in the vertical direction including vertical writing characters(Japanese, Mongolian, Hangul, etc).
underline-font-size-vlr-003 'text-decoration: underline' with various font sizes http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property 05a00f9e67ec770a68184f514da16d42f3664b4e `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.
underline-font-size-vlr-005 'text-decoration: underline' with various font sizes and mixed text http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property cf494cde416df9487dabe224857d7c09849b13a7 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.
underline-font-size-vrl-002 'text-decoration: underline' with various font sizes http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property fde426aff2dd0f2666881af719f8a933595db5e5 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.
underline-font-size-vrl-004 'text-decoration: underline' with various font sizes and mixed text http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property b37f8604be0f98e2fb03f2f2198170017232ece1 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.
underline-mixed-vlr-003 'text-decoration: underline' and mixed text http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property ffd107c6592a7876badaee2070b4aac10886bbc3 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.
underline-mixed-vrl-002 'text-decoration: underline' and mixed text http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property 233697bcbc7031e4901fe8df986802a06698c850 `G&eacute;rard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.
unicode-bidi-001 reference/direction-002-ref Unicode-bidi set to 'normal' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction 23dd56a09e50c8f068ed78bfbec09343f4189224 `Microsoft`<http://www.microsoft.com/> The property 'unicode-bidi' set to 'normal' doesn't modify the directionality of text.
unicode-bidi-002 reference/unicode-bidi-002-ref Unicode-bidi set to 'embed' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction 4b27955dff5183c9c707ec654c50ab0d5c9509f4 `Microsoft`<http://www.microsoft.com/> The property 'unicode-bidi' set to 'embed' opens a new level of embedding in the Unicode bi-directional algorithm.
unicode-bidi-003 reference/direction-002-ref Unicode-bidi set to 'bidi-override' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction 6b6e2d5a6826f07407b45cc0c1f26cfb111c730a `Microsoft`<http://www.microsoft.com/> The property 'unicode-bidi' set to 'bidi-override' overrides the directionality of text.
@ -828,46 +835,14 @@ unicode-bidi-applies-to-012 reference/direction-applies-to-008-ref Unicode-bidi
unicode-bidi-applies-to-013 reference/direction-applies-to-008-ref Unicode-bidi applied to element with 'display' set to 'table' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction 5e96cad2593bff9bf262c57806aa45b87820f36b `Microsoft`<http://www.microsoft.com/> The 'unicode-bidi' property does not apply to elements with a display of 'table'. 'unicode-bidi' property only applies to inline elements or block containers' immediate inline-level descendants.
unicode-bidi-applies-to-014 reference/direction-applies-to-008-ref Unicode-bidi applied to element with 'display' set to 'inline-table' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction 1ea78d913a72bdf534c9701bc8a771df856e3d2f `Microsoft`<http://www.microsoft.com/> The 'unicode-bidi' property does not apply to elements with a display of 'inline-table'. 'unicode-bidi' property only applies to inline elements or block containers' immediate inline-level descendants.
unicode-bidi-applies-to-015 reference/direction-applies-to-008-ref Unicode-bidi applied to element with 'display' set to 'table-caption' http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#propdef-unicode-bidi,http://www.w3.org/TR/CSS21/visuren.html#direction f319b3e86aea3385f390f78d56ba608a6ac94f27 `Microsoft`<http://www.microsoft.com/> The 'unicode-bidi' property applies to elements with a display of 'table-caption'.
vertical-alignment-002a vertical align - 'baseline' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height a55994c93e6652bdc61229154fe73727bd2c9aea `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-002b vertical align - 'baseline' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 779a3696b7909f11787ad979d92c965675b8ed71 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-003a vertical align - 'baseline' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 66706a353742efd4400d64575c633bb17a2a7252 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-003b vertical align - 'baseline' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height c28364f9b1f41b8538e624119234b1d35d6c6091 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-005a vertical align - 'sub' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 2df8dff5be7453c111fb9364ef9d796a91095b3a `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-005b vertical align - 'sub' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 2fc7c00892fc1d5860633a96bba4ba7878ad7004 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-008a vertical align - 'super' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 9dc8848f9db104ed33e3001e946369278588df9c `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-008b vertical align - 'super' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 7de9f0763dbb93b0f55dceb7b80116c87ad800df `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-011a vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height e3c5648ce732c30881a84fb5a0a8083191332a56 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-011b vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 724bbb86a2b9ec3bd9252fec92cacd6212775175 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-012l vertical align - 'zero length (0em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 1684f5ad59fd0c5ce9f9d3190bf569388b3557ba `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-012r vertical align - 'zero length (0em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height dcd288dd395eea47285230ca20aa83dd6c874f17 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-014a vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 199a8e04915d4e564618ef120bf32e5c568cafc0 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-014b vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 755eb3f5800991c4d7df16dc70d2aaf30e419c42 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-015a vertical align - 'positive length (0.5em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 32b2362ace97e299f7beaa3aac8d3323837c7fc8 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-015b vertical align - 'positive length (0.5em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height f059163e577bcbadccf1e2912c2c8724777930c2 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-017a vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 83b231bd5ad62e4e981f504bedbe7bfde444335d `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-017b vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 20354412b9971eb45aafda4db62c290f6a2b1602 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-018a vertical align - 'negative length (-0.5em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 7cc30a291d2c69b03bd4179951b87c58e2a02ccb `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-018b vertical align - 'negative length (-0.5em)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height bda9934745cc38f21bcb4235eac2d5824d849f9f `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-020a vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 6533d451114b23d657e6bbc8362390a1c4aaf1eb `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-020b vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout) image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 7b7ff221754d9c3bc955380e044413ccfbf7ee8b `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-021a vertical align - 'zero percentage (0%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 9ddfeee8aeba9e1241ce506ec75af1ba37f6ef06 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-021b vertical align - 'zero percentage (0%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 0e68e5e6821c0645ff08d40eb02e7ddd87d99caf `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-023a vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height d42792f46d6c5d9052eaf7ed1c7981d3968fdc07 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-023b vertical align - 'positive percentage (80%)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height a13b1e018382f0e99499b691e9cbbe8f2bcfb740 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-024a vertical align - 'positive percentage (50%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 339511c5b7a5eef6400b44a7cb6403adebe16ae0 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-024b vertical align - 'positive percentage (50%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height d6cc4618d830dfb7a86b471d7b149546f7721bd4 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-026a vertical align - 'negative percentage (-20%)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height 777a16060504fa5c1a2c649279ee6dbcb56729ad `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-026b vertical align - 'negative length (-20%)' (alphabetical baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height fb3d8d2c8ec17a80bc05d9cf6027855dab6b9836 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.
vertical-alignment-027a vertical align - 'negative percentage (-50%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height ca2c37b2acc7a2be0e438b5069acd2286487b6ab `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-027b vertical align - 'negative percentage (-50%)' (central baseline with vertical layout) ahem,image http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment,http://www.w3.org/TR/CSS21/visudet.html#line-height eb3ef979b26f31507a2f72ba374274fd22113364 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.
vertical-alignment-new-002 reference/vertical-alignment-new-002-ref vertical-align - 'top' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 515da3806b29df524807102d2a3a278cd8ee89b7 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.
vertical-alignment-new-003 reference/vertical-alignment-new-002-ref vertical-align - 'top' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading d8711ff67efb10fec65c3cd87238a69f94a4b85d `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.
vertical-alignment-new-004 reference/vertical-alignment-new-004-ref vertical-align - 'text-top' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 234bc9d84450e317b1b9243cda9b0f9a261b360d `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.
vertical-alignment-new-005 reference/vertical-alignment-new-004-ref vertical-align - 'text-top' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading eca0b3cf343e86cc7ec5c08969adfd7b603ed51a `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.
vertical-alignment-new-006 reference/vertical-alignment-new-006-ref vertical-align - 'text-bottom' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 61e9e28954d65bb677c10c1ecabe02697a4be616 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.
vertical-alignment-new-007 reference/vertical-alignment-new-006-ref vertical-align - 'text-bottom' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading b8f4194fc311ebd51130715a3947c69f63e3c21b `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.
vertical-alignment-new-008 reference/vertical-alignment-new-008-ref vertical-align - 'bottom' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 73e2f80c8ee8ddd097b71d7b07b9b886e5895f0f `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.
vertical-alignment-new-009 reference/vertical-alignment-new-008-ref vertical-align - 'bottom' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading aa74713244d8619cc17b458de1eba22f22f87c5a `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.
vertical-alignment-002 reference/vertical-alignment-002-ref vertical-align - 'top' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 4c53752f7cb914db7dbaaa14f288b68bf309a007 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.
vertical-alignment-003 reference/vertical-alignment-002-ref vertical-align - 'top' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 1026d4c787262714d3f0a446435d77f99dd791ff `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box.
vertical-alignment-004 reference/vertical-alignment-004-ref vertical-align - 'text-top' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 5a5453f032ae0dc73575f7a1b1cda98f702e4cbd `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.
vertical-alignment-005 reference/vertical-alignment-004-ref vertical-align - 'text-top' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading dd1d34eeed4dc29947946f23c1bb33a52c137a6b `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area.
vertical-alignment-006 reference/vertical-alignment-006-ref vertical-align - 'text-bottom' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading ebaa202f68415b725ed9b57425d6dfc4143e8c84 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.
vertical-alignment-007 reference/vertical-alignment-006-ref vertical-align - 'text-bottom' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 5a6fc29d4ee3bd782a04c4e118b53801e5c8eb3b `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area.
vertical-alignment-008 reference/vertical-alignment-008-ref vertical-align - 'bottom' and vertical-rl writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading fea0050dbf199c607d6a17263f4b49d0303bdc50 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.
vertical-alignment-009 reference/vertical-alignment-008-ref vertical-align - 'bottom' and vertical-lr writing-mode ahem http://www.w3.org/TR/css-writing-modes-3/#line-mappings,http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading 17c24fd05a1e0b837b6e65096f068bebd6108b19 `Hajime Shiozawa`<mailto:hajime.shiozawa@gmail.com> This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box.
writing-mode-horizontal-001l reference/writing-mode-horizontal-001l-ref CSS Writing Modes: text-combine-upright in horizontal writing mode http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright 820b6baaa9ff63cf1a29b989c8d68ebdafe3c4da `Masataka Yakura`<http://google.com/+MasatakaYakura> text-combine-upright does not have an effect in horizontal writing modes.
writing-mode-horizontal-001r reference/writing-mode-horizontal-001r-ref CSS Writing Modes: text-combine-upright in horizontal writing mode http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright 946a8be6f47e1cdc7ca7539e48e9964bd77c9ba9 `Masataka Yakura`<http://google.com/+MasatakaYakura> text-combine-upright does not have an effect in horizontal writing modes.
writing-mode-stretch-001 reference/writing-mode-stretch-001-ref writing-mode vertical-lr and vertical-rl http://www.w3.org/TR/css-writing-modes-3/#writing-mode b39073243c9598d184c1f6efc298247a42f34aea `Mitsuteru Sawa`<mailto:mitsuteru.s@gmail.com> vertical-writing-mode flex items should stretch

44
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-004.xht Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Test: The bidi algorithm and inlines in CSS</title>
<link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch" />
<link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/inline/bidi/004.html" type="text/html" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model" />
<link rel="help" href="http://www.w3.org/TR/css-text-3/#white-space-rules" />
<!-- Spaces are collapsed, then reordered, then trimmed. -->
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#bidi-control-codes" />
<link rel="help" href="http://www.w3.org/TR/CSS21/box.html#bidi-box-model" />
<link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#direction" />
<link rel="help" href="http://www.w3.org/TR/CSS21/text.html#white-space-model" />
<link rel="help" href="http://unicode.org/reports/tr9/" />
<link rel="help" href="http://www.w3.org/TR/html5/rendering.html#phrasing-content-0" /> <!-- <br> is a bidi paragraph separator -->
<link rel="match" href="reference/bidi-004-ref.xht" />
<meta name="flags" content="may21 ahem" />
<style type="text/css">
div p { width: 28em; border: solid; margin: 1em; padding: 0.5em; background: #FFFFCC; color: black; font: 1em/1 Ahem; }
.test { border: solid; padding: 0.4em 1em; line-height: 3em; }
.control { line-height: 3em; }
.control.start { border-style: solid none solid solid; padding: 0.4em 0 0.4em 1em; }
.control.middle { border-style: solid none solid none; padding: 0.4em 0 0.4em 0; }
.control.end { border-style: solid solid solid none; padding: 0.4em 1em 0.4em 0; }
.a { color: navy; }
.b { color: orange; }
</style>
</head>
<body>
<p> The following two blocks should be identical, including overflow. (Force bidi: א) </p>
<div>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br /><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br /><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
<p>
<!-- (note that everything between the RLO to the PDF is backwards) -->
<!-- line 1...................--> <!-- line 2........................................--> <!-- line 3...................-->
<span class="test a"> pppp pppX ppXp ‮ ppXp XXpp XppX </span> pppX XXXp pXXp <span class="test b"> XpXp ppXX XXpX pXpX ‬ XXpX XXXp </span>
</p>
</div>
</body>
</html>

12
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-2.xht
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Inline Direction and Bidirectionality (162 tests)</h2>
<h2>Inline Direction and Bidirectionality (163 tests)</h2>
<table width="100%">
<col id="test-column"></col>
<col id="refs-column"></col>
@ -1613,7 +1613,7 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s2.4">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#bidi-box-model">2.4 Box model for inline boxes in bidirectional context</a></th></tr>
<!-- 25 tests -->
<!-- 26 tests -->
<tr id="bidi-001-2.4" class="primary">
<td><strong>
<a href="bidi-001.xht">bidi-001</a></strong></td>
@ -1647,6 +1647,14 @@
</ul>
</td>
</tr>
<tr id="bidi-004-2.4" class="primary ahem may21">
<td><strong>
<a href="bidi-004.xht">bidi-004</a></strong></td>
<td><a href="reference/bidi-004-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="may21" title="Behavior tested is preferred but optional">Optional</abbr></td>
<td>The bidi algorithm and inlines in CSS
</td>
</tr>
<tr id="bidi-005-2.4" class="">
<td>
<a href="bidi-005.xht">bidi-005</a></td>

356
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-4.xht
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Inline-level Alignment (70 tests)</h2>
<h2>Inline-level Alignment (38 tests)</h2>
<table width="100%">
<col id="test-column"></col>
<col id="refs-column"></col>
@ -485,359 +485,7 @@
<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>
<!-- 32 tests -->
<tr id="vertical-alignment-002a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-002a.xht">vertical-alignment-002a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-002b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-002b.xht">vertical-alignment-002b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-003a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-003a.xht">vertical-alignment-003a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-003b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-003b.xht">vertical-alignment-003b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'baseline' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-005a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-005a.xht">vertical-alignment-005a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'sub' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-005b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-005b.xht">vertical-alignment-005b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'sub' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-008a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-008a.xht">vertical-alignment-008a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'super' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-008b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-008b.xht">vertical-alignment-008b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'super' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-011a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-011a.xht">vertical-alignment-011a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-011b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-011b.xht">vertical-alignment-011b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-012l-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-012l.xht">vertical-alignment-012l</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-012r-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-012r.xht">vertical-alignment-012r</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero length (0em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-014a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-014a.xht">vertical-alignment-014a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-014b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-014b.xht">vertical-alignment-014b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-015a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-015a.xht">vertical-alignment-015a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-015b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-015b.xht">vertical-alignment-015b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-017a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-017a.xht">vertical-alignment-017a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-017b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-017b.xht">vertical-alignment-017b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.2em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-018a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-018a.xht">vertical-alignment-018a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-018b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-018b.xht">vertical-alignment-018b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-0.5em)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-020a-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-020a.xht">vertical-alignment-020a</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-020b-4.4" class="primary image">
<td><strong>
<a href="vertical-alignment-020b.xht">vertical-alignment-020b</a></strong></td>
<td></td>
<td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-021a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-021a.xht">vertical-alignment-021a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-021b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-021b.xht">vertical-alignment-021b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'zero percentage (0%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-023a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-023a.xht">vertical-alignment-023a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive length (0.8em)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-023b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-023b.xht">vertical-alignment-023b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (80%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-024a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-024a.xht">vertical-alignment-024a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-024b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-024b.xht">vertical-alignment-024b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'positive percentage (50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-026a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-026a.xht">vertical-alignment-026a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-20%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-026b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-026b.xht">vertical-alignment-026b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative length (-20%)' (alphabetical baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-027a-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-027a.xht">vertical-alignment-027a</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-027b-4.4" class="primary ahem image">
<td><strong>
<a href="vertical-alignment-027b.xht">vertical-alignment-027b</a></strong></td>
<td></td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
<td>vertical align - 'negative percentage (-50%)' (central baseline with vertical layout)
<ul class="assert">
<li>This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline.</li>
</ul>
</td>
</tr>
<!-- 0 tests -->
</tbody>
<tbody id="s4.4.#dominant-baseline">
<!-- 0 tests -->

118
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-7.xht
View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Writing Modes Module Level 3 CR Test Suite</h1>
<h2>Abstract Box Layout (489 tests)</h2>
<h2>Abstract Box Layout (495 tests)</h2>
<table width="100%">
<col id="test-column"></col>
<col id="refs-column"></col>
@ -4637,7 +4637,7 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s7.5">+</a>
<a href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings">7.5 Line-Relative Mappings</a></th></tr>
<!-- 26 tests -->
<!-- 32 tests -->
<tr id="text-decoration-sidewaysleft-vlr-003-7.5" class="primary">
<td><strong>
<a href="text-decoration-sidewaysleft-vlr-003.xht">text-decoration-sidewaysleft-vlr-003</a></strong></td>
@ -4836,10 +4836,76 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-002-7.5" class="primary ahem">
<tr id="underline-font-size-vlr-003-7.5" class="primary">
<td><strong>
<a href="vertical-alignment-new-002.xht">vertical-alignment-new-002</a></strong></td>
<td><a href="reference/vertical-alignment-new-002-ref.xht">=</a> </td>
<a href="underline-font-size-vlr-003.xht">underline-font-size-vlr-003</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vlr-005-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vlr-005.xht">underline-font-size-vlr-005</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vrl-002-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vrl-002.xht">underline-font-size-vrl-002</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-font-size-vrl-004-7.5" class="primary">
<td><strong>
<a href="underline-font-size-vrl-004.xht">underline-font-size-vrl-004</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' with various font sizes and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger.</li>
</ul>
</td>
</tr>
<tr id="underline-mixed-vlr-003-7.5" class="primary">
<td><strong>
<a href="underline-mixed-vlr-003.xht">underline-mixed-vlr-003</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.</li>
</ul>
</td>
</tr>
<tr id="underline-mixed-vrl-002-7.5" class="primary">
<td><strong>
<a href="underline-mixed-vrl-002.xht">underline-mixed-vrl-002</a></strong></td>
<td></td>
<td></td>
<td>'text-decoration: underline' and mixed text
<ul class="assert">
<li>This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text.</li>
</ul>
</td>
</tr>
<tr id="vertical-alignment-002-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-002.xht">vertical-alignment-002</a></strong></td>
<td><a href="reference/vertical-alignment-002-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'top' and vertical-rl writing-mode
<ul class="assert">
@ -4847,10 +4913,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-003-7.5" class="primary ahem">
<tr id="vertical-alignment-003-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-003.xht">vertical-alignment-new-003</a></strong></td>
<td><a href="reference/vertical-alignment-new-002-ref.xht">=</a> </td>
<a href="vertical-alignment-003.xht">vertical-alignment-003</a></strong></td>
<td><a href="reference/vertical-alignment-002-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'top' and vertical-lr writing-mode
<ul class="assert">
@ -4858,10 +4924,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-004-7.5" class="primary ahem">
<tr id="vertical-alignment-004-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-004.xht">vertical-alignment-new-004</a></strong></td>
<td><a href="reference/vertical-alignment-new-004-ref.xht">=</a> </td>
<a href="vertical-alignment-004.xht">vertical-alignment-004</a></strong></td>
<td><a href="reference/vertical-alignment-004-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-top' and vertical-rl writing-mode
<ul class="assert">
@ -4869,10 +4935,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-005-7.5" class="primary ahem">
<tr id="vertical-alignment-005-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-005.xht">vertical-alignment-new-005</a></strong></td>
<td><a href="reference/vertical-alignment-new-004-ref.xht">=</a> </td>
<a href="vertical-alignment-005.xht">vertical-alignment-005</a></strong></td>
<td><a href="reference/vertical-alignment-004-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-top' and vertical-lr writing-mode
<ul class="assert">
@ -4880,10 +4946,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-006-7.5" class="primary ahem">
<tr id="vertical-alignment-006-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-006.xht">vertical-alignment-new-006</a></strong></td>
<td><a href="reference/vertical-alignment-new-006-ref.xht">=</a> </td>
<a href="vertical-alignment-006.xht">vertical-alignment-006</a></strong></td>
<td><a href="reference/vertical-alignment-006-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-bottom' and vertical-rl writing-mode
<ul class="assert">
@ -4891,10 +4957,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-007-7.5" class="primary ahem">
<tr id="vertical-alignment-007-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-007.xht">vertical-alignment-new-007</a></strong></td>
<td><a href="reference/vertical-alignment-new-006-ref.xht">=</a> </td>
<a href="vertical-alignment-007.xht">vertical-alignment-007</a></strong></td>
<td><a href="reference/vertical-alignment-006-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'text-bottom' and vertical-lr writing-mode
<ul class="assert">
@ -4902,10 +4968,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-008-7.5" class="primary ahem">
<tr id="vertical-alignment-008-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-008.xht">vertical-alignment-new-008</a></strong></td>
<td><a href="reference/vertical-alignment-new-008-ref.xht">=</a> </td>
<a href="vertical-alignment-008.xht">vertical-alignment-008</a></strong></td>
<td><a href="reference/vertical-alignment-008-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'bottom' and vertical-rl writing-mode
<ul class="assert">
@ -4913,10 +4979,10 @@
</ul>
</td>
</tr>
<tr id="vertical-alignment-new-009-7.5" class="primary ahem">
<tr id="vertical-alignment-009-7.5" class="primary ahem">
<td><strong>
<a href="vertical-alignment-new-009.xht">vertical-alignment-new-009</a></strong></td>
<td><a href="reference/vertical-alignment-new-008-ref.xht">=</a> </td>
<a href="vertical-alignment-009.xht">vertical-alignment-009</a></strong></td>
<td><a href="reference/vertical-alignment-008-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>vertical-align - 'bottom' and vertical-lr writing-mode
<ul class="assert">

16
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/first-page-vrl-002.xht
View file

@ -1,16 +1,16 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: first page of a document with vertical-rl writing-mode</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"/>
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" title="3.1 Block Flow Direction: the writing-mode property"/>
<link rel="help" href="http://www.w3.org/TR/CSS21/page.html#page-selectors" title="13.2.2 Page selectors: selecting left, right, and first pages"/>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" title="3.1 Block Flow Direction: the writing-mode property" />
<link rel="help" href="http://www.w3.org/TR/CSS21/page.html#page-selectors" title="13.2.2 Page selectors: selecting left, right, and first pages" />
<meta content="image paged" name="flags"/>
<meta content="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." name="assert"/>
<meta content="image paged" name="flags" />
<meta content="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." name="assert" />
<style type="text/css" media="print"><![CDATA[
html
@ -40,7 +40,7 @@
<body>
<p><img src="support/pass-cdts-first-page-vrl-002.png" alt="Image download support must be enabled"/></p>
<p><img src="support/pass-cdts-first-page-vrl-002.png" alt="Image download support must be enabled" /></p>
<!--
The image says:

33
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-004-ref.xht Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Reftest Reference</title>
<link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact" />
<meta name="flags" content="ahem" />
<style type="text/css">
div p { width: 28em; border: solid; margin: 1em; padding: 0.5em; background: #FFFFCC; color: black; font: 1em/1 Ahem; }
.control { line-height: 3em; }
.control.start { border-style: solid none solid solid; padding: 0.4em 0 0.4em 1em; }
.control.middle { border-style: solid none solid none; padding: 0.4em 0 0.4em 0; }
.control.end { border-style: solid solid solid none; padding: 0.4em 1em 0.4em 0; }
.a { color: navy; }
.b { color: orange; }
</style>
</head>
<body>
<p> The following two blocks should be identical, including overflow. (Force bidi: א) </p>
<div>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br /><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br /><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
<p>
<span class="control a start">pppp&nbsp;pppX&nbsp;ppXp&nbsp;ppXX&nbsp;pXpp</span><br /><span class="control b start">pXpX</span>&nbsp;pXXp&nbsp;pXXX&nbsp;Xppp<span class="control a end">&nbsp;XppX</span><br /><span class="control b end">XpXp&nbsp;XpXX&nbsp;XXpp&nbsp;XXpX&nbsp;XXXp</span>
</p>
</div>
</body>
</html>

5
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-new-002-ref.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-002-ref.xht
View file

@ -3,6 +3,7 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
img
@ -17,7 +18,7 @@
img#orange
{
padding-left: 120px; /* = the position of orange square */
margin-top: 30px;
}
]]></style>
@ -29,7 +30,7 @@
<p>Test passes if the right edge of an blue square is aligned with the left edge of a orange square.</p>
<div>
<img id="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled" /><br /><!--
<img id="blue" src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled" /><!--
--><img id="orange" src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled" />
</div>

7
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-new-004-ref.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-004-ref.xht
View file

@ -3,6 +3,7 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-01 -->
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
img
@ -12,13 +13,9 @@
img
{
padding-left: 60px; /* = the position of first orange square */
padding-left: 60px; /* = position of orange squares */
}
img + br + img
{
padding-left: 60px; /* = the position of second orange square*/
}
]]></style>
</head>

7
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-new-006-ref.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-006-ref.xht
View file

@ -3,6 +3,7 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
img
@ -12,12 +13,12 @@
img
{
padding-left: 15px; /* = the position of first orange square */
padding-left: 60px; /* = the position of first orange square */
}
img + br + img
{
padding-left: 15px; /* = the position of second orange square*/
padding-left: 90px; /* = the position of second orange square*/
}
]]></style>
@ -25,7 +26,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div>
<img src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled" /><br /><!--

14
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-new-008-ref.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-008-ref.xht
View file

@ -3,16 +3,12 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Reftest Reference</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
img
{
vertical-align: top;
}
img#orange
{
padding-top: 60px; /* = the height of first character */
padding-left: 30px;
}
]]></style>
@ -20,11 +16,11 @@
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div>
<img src="support/swatch-blue.png" width="120" height="120" alt="Image download support must be enabled" /><!--
--><img id="orange" src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled" />
<img id="orange" src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled" /><!--
--><img src="support/swatch-blue.png" width="60" height="60" alt="Image download support must be enabled" />
</div>
</body>

56
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest-toc.xht
View file

@ -2208,6 +2208,14 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="bidi-004" class="ahem may21">
<tr>
<td rowspan="1" title="The bidi algorithm and inlines in CSS">
<a href="bidi-004.xht">bidi-004</a></td>
<td><a href="reference/bidi-004-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="may21" title="Behavior tested is preferred but optional">Optional</abbr></td>
</tr>
</tbody>
<tbody id="bidi-011" class="">
<tr>
<td rowspan="1" title="The bidi algorithm and inlines in CSS wrapping bidi formatting characters">
@ -5752,67 +5760,67 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-002" class="ahem">
<tbody id="vertical-alignment-002" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'top' and vertical-rl writing-mode">
<a href="vertical-alignment-new-002.xht">vertical-alignment-new-002</a></td>
<td><a href="reference/vertical-alignment-new-002-ref.xht">=</a> </td>
<a href="vertical-alignment-002.xht">vertical-alignment-002</a></td>
<td><a href="reference/vertical-alignment-002-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-003" class="ahem">
<tbody id="vertical-alignment-003" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'top' and vertical-lr writing-mode">
<a href="vertical-alignment-new-003.xht">vertical-alignment-new-003</a></td>
<td><a href="reference/vertical-alignment-new-002-ref.xht">=</a> </td>
<a href="vertical-alignment-003.xht">vertical-alignment-003</a></td>
<td><a href="reference/vertical-alignment-002-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-004" class="ahem">
<tbody id="vertical-alignment-004" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-top' and vertical-rl writing-mode">
<a href="vertical-alignment-new-004.xht">vertical-alignment-new-004</a></td>
<td><a href="reference/vertical-alignment-new-004-ref.xht">=</a> </td>
<a href="vertical-alignment-004.xht">vertical-alignment-004</a></td>
<td><a href="reference/vertical-alignment-004-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-005" class="ahem">
<tbody id="vertical-alignment-005" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-top' and vertical-lr writing-mode">
<a href="vertical-alignment-new-005.xht">vertical-alignment-new-005</a></td>
<td><a href="reference/vertical-alignment-new-004-ref.xht">=</a> </td>
<a href="vertical-alignment-005.xht">vertical-alignment-005</a></td>
<td><a href="reference/vertical-alignment-004-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-006" class="ahem">
<tbody id="vertical-alignment-006" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-bottom' and vertical-rl writing-mode">
<a href="vertical-alignment-new-006.xht">vertical-alignment-new-006</a></td>
<td><a href="reference/vertical-alignment-new-006-ref.xht">=</a> </td>
<a href="vertical-alignment-006.xht">vertical-alignment-006</a></td>
<td><a href="reference/vertical-alignment-006-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-007" class="ahem">
<tbody id="vertical-alignment-007" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'text-bottom' and vertical-lr writing-mode">
<a href="vertical-alignment-new-007.xht">vertical-alignment-new-007</a></td>
<td><a href="reference/vertical-alignment-new-006-ref.xht">=</a> </td>
<a href="vertical-alignment-007.xht">vertical-alignment-007</a></td>
<td><a href="reference/vertical-alignment-006-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-008" class="ahem">
<tbody id="vertical-alignment-008" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'bottom' and vertical-rl writing-mode">
<a href="vertical-alignment-new-008.xht">vertical-alignment-new-008</a></td>
<td><a href="reference/vertical-alignment-new-008-ref.xht">=</a> </td>
<a href="vertical-alignment-008.xht">vertical-alignment-008</a></td>
<td><a href="reference/vertical-alignment-008-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>
<tbody id="vertical-alignment-new-009" class="ahem">
<tbody id="vertical-alignment-009" class="ahem">
<tr>
<td rowspan="1" title="vertical-align - 'bottom' and vertical-lr writing-mode">
<a href="vertical-alignment-new-009.xht">vertical-alignment-new-009</a></td>
<td><a href="reference/vertical-alignment-new-008-ref.xht">=</a> </td>
<a href="vertical-alignment-009.xht">vertical-alignment-009</a></td>
<td><a href="reference/vertical-alignment-008-ref.xht">=</a> </td>
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
</tr>
</tbody>

17
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest.list
View file

@ -272,6 +272,7 @@ baseline-inline-replaced-003.xht == reference/baseline-inline-replaced-002-ref.x
bidi-001.xht == reference/bidi-001-ref.xht
bidi-002.xht == reference/bidi-002-ref.xht
bidi-003.xht == reference/bidi-003-ref.xht
bidi-004.xht == reference/bidi-004-ref.xht
bidi-011.xht == reference/bidi-011-ref.xht
bidi-box-model-001.xht == reference/bidi-box-model-001-ref.xht
bidi-box-model-002.xht == reference/bidi-box-model-001-ref.xht
@ -715,14 +716,14 @@ unicode-bidi-applies-to-012.xht == reference/direction-applies-to-008-ref.xht
unicode-bidi-applies-to-013.xht == reference/direction-applies-to-008-ref.xht
unicode-bidi-applies-to-014.xht == reference/direction-applies-to-008-ref.xht
unicode-bidi-applies-to-015.xht == reference/direction-applies-to-008-ref.xht
vertical-alignment-new-002.xht == reference/vertical-alignment-new-002-ref.xht
vertical-alignment-new-003.xht == reference/vertical-alignment-new-002-ref.xht
vertical-alignment-new-004.xht == reference/vertical-alignment-new-004-ref.xht
vertical-alignment-new-005.xht == reference/vertical-alignment-new-004-ref.xht
vertical-alignment-new-006.xht == reference/vertical-alignment-new-006-ref.xht
vertical-alignment-new-007.xht == reference/vertical-alignment-new-006-ref.xht
vertical-alignment-new-008.xht == reference/vertical-alignment-new-008-ref.xht
vertical-alignment-new-009.xht == reference/vertical-alignment-new-008-ref.xht
vertical-alignment-002.xht == reference/vertical-alignment-002-ref.xht
vertical-alignment-003.xht == reference/vertical-alignment-002-ref.xht
vertical-alignment-004.xht == reference/vertical-alignment-004-ref.xht
vertical-alignment-005.xht == reference/vertical-alignment-004-ref.xht
vertical-alignment-006.xht == reference/vertical-alignment-006-ref.xht
vertical-alignment-007.xht == reference/vertical-alignment-006-ref.xht
vertical-alignment-008.xht == reference/vertical-alignment-008-ref.xht
vertical-alignment-009.xht == reference/vertical-alignment-008-ref.xht
writing-mode-horizontal-001l.xht == reference/writing-mode-horizontal-001l-ref.xht
writing-mode-horizontal-001r.xht == reference/writing-mode-horizontal-001r-ref.xht
writing-mode-stretch-001.xht == reference/writing-mode-stretch-001-ref.xht

6
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/toc.xht
View file

@ -27,7 +27,7 @@
<tbody id="s2">
<tr><th><a href="chapter-2.xht">Chapter 2 -
Inline Direction and Bidirectionality</a></th>
<td>(162 Tests)</td></tr>
<td>(163 Tests)</td></tr>
</tbody>
<tbody id="s3">
<tr><th><a href="chapter-3.xht">Chapter 3 -
@ -37,7 +37,7 @@
<tbody id="s4">
<tr><th><a href="chapter-4.xht">Chapter 4 -
Inline-level Alignment</a></th>
<td>(70 Tests)</td></tr>
<td>(38 Tests)</td></tr>
</tbody>
<tbody id="s5">
<tr><th><a href="chapter-5.xht">Chapter 5 -
@ -52,7 +52,7 @@
<tbody id="s7">
<tr><th><a href="chapter-7.xht">Chapter 7 -
Abstract Box Layout</a></th>
<td>(489 Tests)</td></tr>
<td>(495 Tests)</td></tr>
</tbody>
<tbody id="s8">
<tr><th><a href="chapter-8.xht">Chapter 8 -

49
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-font-size-vlr-003.xht Normal file
View file

@ -0,0 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<link rel="bookmark" href="http://www.w3.org/TR/css-text-decor-3/leftline-cross.png" title="" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn" xml:lang="mn">ᠨ<span id="larger">ᠨᠨ</span>ᠨ</span></span></div>
</body>
</html>

48
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-font-size-vlr-005.xht Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn" xml:lang="mn">ᠨ<span id="larger" lang="en" xml:lang="en">AB</span>ᠨ</span></span></div>
</body>
</html>

49
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-font-size-vrl-002.xht Normal file
View file

@ -0,0 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<link rel="bookmark" href="http://www.w3.org/TR/css-text-decor-3/leftline-cross.png" title="" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja" xml:lang="ja">方<span id="larger">方方</span>方</span></span></div>
</body>
</html>

48
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-font-size-vrl-004.xht Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' with various font sizes and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text or even if font size of text is larger." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
span#larger
{
font-size: 1.5em;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja" xml:lang="ja">方<span id="larger" lang="en" xml:lang="en">AB</span>方</span></span></div>
</body>
</html>

43
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-mixed-vlr-003.xht Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-lr;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="mn" xml:lang="mn">ᠨ<span lang="en" xml:lang="en">AB</span>ᠨ</span></span></div>
</body>
</html>

43
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/underline-mixed-vrl-002.xht Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: 'text-decoration: underline' and mixed text</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" title="7.5 Line-Relative Mappings" />
<link rel="help" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" title="2.6. Text Underline Position: the 'text-underline-position' property" />
<meta content="" name="flags" />
<meta content="This test checks that when latin and east-asian glyphs are used in mixed text-orientation (therefore with text centrally baseline-aligned), then the text-decoration of the parent box is used across the parent box even if that cuts through glyphs of descendant text or through em box of descendant text." name="assert" />
<style type="text/css"><![CDATA[
div#vrl
{
font-size: 4em;
margin-left: 2em;
writing-mode: vertical-rl;
}
span#outer
{
text-decoration: underline;
}
span#inner
{
color: transparent;
}
]]></style>
</head>
<body>
<p>Test passes if there is <strong>one and only one vertical straight and unbroken line</strong>. Such line should have the same thickness over its entire length.</p>
<div id="vrl"><span id="outer"><span id="inner" lang="ja" xml:lang="ja">方<span lang="en" xml:lang="en">AB</span>方</span></span></div>
</body>
</html>

4
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-002.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002.xht
View file

@ -3,10 +3,11 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box." />
<link rel="match" href="reference/vertical-alignment-new-002-ref.xht" />
<link rel="match" href="reference/vertical-alignment-002-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#rl
@ -21,6 +22,7 @@
font-size: 0.5em;
color: orange;
vertical-align: top;
margin-top: -1em;
}
]]></style>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002a.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'baseline' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002b.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'baseline' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

11
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-003.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003.xht
View file

@ -3,25 +3,26 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'top' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'top', the physical right (logical top) edge of an inline non-replaced box is aligned with the physical right (logical top) edge of its line box." />
<link rel="match" href="reference/vertical-alignment-new-002-ref.xht" />
<link rel="match" href="reference/vertical-alignment-002-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#lr
{
border-right: blue solid 2em;
writing-mode: vertical-lr;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: top;
line-height: 1;
margin-top: -1em;
}
]]></style>
@ -29,7 +30,7 @@
<body>
<p>Test passes if the right edge of an orange square touches the left edge of a blue square.</p>
<p>Test passes if the right edge of an blue square is aligned with the left edge of a orange square.</p>
<div id="lr">A<span id="orange">O</span></div>

70
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003a.xht
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'baseline' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="ahem image" />
<style type="text/css"><![CDATA[
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003b.xht
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'baseline' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="ahem image" />
<style type="text/css"><![CDATA[
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: baseline;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

5
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-004.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-004.xht
View file

@ -3,16 +3,17 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'text-top' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-01 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area." />
<link rel="match" href="reference/vertical-alignment-new-004-ref.xht" />
<link rel="match" href="reference/vertical-alignment-004-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#rl
{
color: orange;
font: 3.75em/3 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-rl;
}

8
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-005.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005.xht
View file

@ -3,16 +3,17 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'text-top' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-top', the physical right (logical top) edge of an inline non-replaced box is aligned with the right side (logical top) of parent's content area." />
<link rel="match" href="reference/vertical-alignment-new-004-ref.xht" />
<link rel="match" href="reference/vertical-alignment-004-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#lr
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-lr;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-top;
line-height: 1;
}
]]></style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="lr">A<span id="orange30">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005a.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'sub' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: sub;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005b.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'sub' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: sub;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">X<sub>LLLLLLLLLLLLL</sub>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

8
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-006.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006.xht
View file

@ -3,16 +3,17 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'text-bottom' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area." />
<link rel="match" href="reference/vertical-alignment-new-006-ref.xht" />
<link rel="match" href="reference/vertical-alignment-006-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#rl
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-rl;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-bottom;
line-height: 1;
}
]]></style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="rl">A<span id="orange30">O</span></div>

8
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-007.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-007.xht
View file

@ -3,16 +3,17 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'text-bottom' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of an inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'text-bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the left side (logical bottom) of parent's content area." />
<link rel="match" href="reference/vertical-alignment-new-006-ref.xht" />
<link rel="match" href="reference/vertical-alignment-006-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#lr
{
color: orange;
font: 3.75em/1.5 Ahem; /* computes to 60px/90px */
font: 3.75em/3 Ahem; /* computes to 60px/180px */
writing-mode: vertical-lr;
}
@ -20,7 +21,6 @@
{
font-size: 0.5em; /* computes to 30px */
vertical-align: text-bottom;
line-height: 1;
}
]]></style>
@ -29,7 +29,7 @@
<body>
<p>Test passes if the <strong>left edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<p>Test passes if the <strong>right edge</strong> of an irregular orange polygon is straight and unbroken.</p>
<div id="lr">A<span id="orange30">O</span></div>

11
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-008.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008.xht
View file

@ -3,25 +3,26 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'bottom' and vertical-rl writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-rl', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box." />
<link rel="match" href="reference/vertical-alignment-new-008-ref.xht" />
<link rel="match" href="reference/vertical-alignment-008-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#rl
{
border-left: blue solid 2em;
writing-mode: vertical-rl;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: bottom;
line-height: 1;
margin-top: -1em;
}
]]></style>
@ -30,7 +31,7 @@
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div id="rl">A<span id="orange">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008a.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'super' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: super;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008b.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'super' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: super;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">X<sup>LLLLLLLLLLLLL</sup>
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

11
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-new-009.xht → tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009.xht
View file

@ -3,25 +3,26 @@
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical-align - 'bottom' and vertical-lr writing-mode</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="reviewer" title="G?rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-09-03 -->
<link rel="help" title="7.5 Line-Relative Mappings" href="http://www.w3.org/TR/css-writing-modes-3/#line-mappings" />
<link rel="help" title="10.8.1 Leading and half-leading" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#leading" />
<meta name="assert" content="This test checks the position of inline non-replaced box with vertical align property. When 'writing-mode' is 'vertical-lr', 'vertical-align' is 'bottom', the physical left (logical bottom) edge of an inline non-replaced box is aligned with the physical left (logical bottom) edge of its line box." />
<link rel="match" href="reference/vertical-alignment-new-008-ref.xht" />
<link rel="match" href="reference/vertical-alignment-008-ref.xht" />
<meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
div#lr
{
border-left: blue solid 2em;
writing-mode: vertical-lr;
font: 3.75em/3 Ahem; /* computes to 60px/180px */
color: white;
color: blue;
}
span#orange
{
font-size: 0.5em;
color: orange;
vertical-align: bottom;
line-height: 1;
margin-top: -1em;
}
]]></style>
@ -30,7 +31,7 @@
<body>
<p>Test passes if the left edge of an orange square touches the right edge of a blue square.</p>
<p>Test passes if the left edge of an blue square is aligned with the right edge of a orange square.</p>
<div id="lr">A<span id="orange">O</span></div>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011a.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-left {
text-orientation: sideways-left;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>right</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-rl">
<p class="sideways-left">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-right-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

67
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011b.xht
View file

@ -1,67 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (alphabetical baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'sideways-left', 'sideways-right' or 'sideways', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="image" />
<style type="text/css"><![CDATA[
div > p {
margin-top: 1em;
font-size: 2em;
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0em;
}
img.line {
margin-top: -230px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.sideways-right {
text-orientation: sideways-right;
}
.sideways {
text-orientation: sideways;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the bottom of glyph 'L' is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>left</strong> edge of yellow square is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="sideways">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
<div class="vertical-lr">
<p class="sideways-right">LLLLLLLLLLLL
<img class="square" src="./support/yellow-square-vert-redline-left-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012l.xht
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="ahem image" />
<style type="text/css"><![CDATA[
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-lr {
writing-mode: vertical-lr;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-lr">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

70
tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012r.xht
View file

@ -1,70 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (central baseline with vertical layout)</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
<link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment" />
<link rel="help" title="10.8 Line height calculations: the 'line-height' and 'vertical-align' properties" href="http://www.w3.org/TR/CSS21/visudet.html#line-height" />
<meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is vertical and when 'text-orientation' is 'mixed', 'upright' or 'use-glyph-orientation', then the central baseline is used as the dominant baseline." />
<meta name="flags" content="ahem image" />
<style type="text/css"><![CDATA[
div > p {
font: 40px/1 "Ahem";
background-color: orange;
}
/* vertical-align */
img {
vertical-align: 0%;
}
img.line {
margin-top: -260px;
}
/* writing-mode property */
.vertical-rl {
writing-mode: vertical-rl;
}
/* text-orientation property */
.mixed {
text-orientation: mixed;
}
.upright {
text-orientation: upright;
}
.use-glyph-orientation {
text-orientation: use-glyph-orientation;
}
/* font-size */
.half {
vertical-align: text-top;
font-size: 0.5em;
}
]]></style>
</head>
<body>
<p>Test passes if ...</p>
<ol>
<li>the <strong>left</strong> edge of black stripe is touching a thin blue line in each 3 orange rectangles and</li>
<li>the <strong>center</strong> of yellow square (showed as a blue line) is aligned to a thin blue line in each 3 orange rectangles and</li>
<li>all 3 orange rectangles are <strong>identical</strong>.</li>
</ol>
<div class="vertical-rl">
<p class="mixed"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="upright"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
<p class="use-glyph-orientation"><span class="half">LLLLLLLLL</span>
<img class="square" src="./support/yellow-square-vert-redline-center-59x59.png" alt="Image download support must be enabled" />
<img class="line" src="./support/blue-vert-line-1x220.png" alt="Image download support must be enabled" />
</p>
</div>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show more