aboutsummaryrefslogtreecommitdiffstats
path: root/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht
diff options
context:
space:
mode:
authorJames Graham <james@hoppipolla.co.uk>2015-07-27 17:47:31 +0100
committerJames Graham <james@hoppipolla.co.uk>2015-07-27 17:47:31 +0100
commitdf03062d626f485dd896ce9c4374dfce447dc657 (patch)
treea96bdde06c6cd88dd68bc5ef4de8277fc6250a60 /tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht
parent662c00a8109c49d4c57343156b774441f4f48640 (diff)
downloadservo-df03062d626f485dd896ce9c4374dfce447dc657.tar.gz
servo-df03062d626f485dd896ce9c4374dfce447dc657.zip
Update CSS tests to revision 2baa72daab8bf37e3e910a9fd311a1eaa5b0f4a8
Diffstat (limited to 'tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht')
-rw-r--r--tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht138
1 files changed, 55 insertions, 83 deletions
diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht
index a802d66934d..c4f3e21c78c 100644
--- a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht
+++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht
@@ -1,99 +1,71 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title>CSS Writing Modes Test: inline-block alignment - inline-block without content (alphabetical alignment with horizontal layout)</title>
+ <title>CSS Writing Modes Test: inline-block alignment - central alignment with vertical layout</title>
<link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" />
+ <link rel="reviewer" title="Gerard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-07-20 -->
<link rel="help" title="CSS3 Writing modes: 4.3. Atomic Inline Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines" />
<link rel="help" title="CSS2.1 9.2.2 Inline-level elements and inline boxes" href="http://www.w3.org/TR/CSS21/visuren.html#inline-boxes" />
- <link rel="match" href="reference/inline-block-alignment-004-ref.xht" />
- <meta name="assert" content="This test checks the generation of empty inline-block baseline. When 'writing-mode' is horizontal, then the alphabetical baseline is used as the dominant baseline." />
- <meta name="flags" content="image" />
+ <link rel="match" href="reference/inline-block-alignment-002-ref.xht" />
+ <meta name="assert" content="This test checks the generation of inline-block baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline." />
+ <meta name="flags" content="ahem" />
<style type="text/css"><![CDATA[
- div > p, div.control {
- font-size: 2em;
- background-color: orange;
- }
- img {
- margin-left: -300px;
- }
+ div#rl-upright
+ {
+ color: orange;
+ font: 3.75em/1 Ahem; /* computes to 60px */
+ height: 4em;
+ writing-mode: vertical-rl;
+ text-orientation: upright;
+ }
- /* writing-mode property */
- .horizontal-tb {
- writing-mode: horizontal-tb;
- }
+ div#inline-block
+ {
+ display: inline-block;
+ padding-left: 0.5em; /* computes to 60px */
+ font-size: 2em; /* computes to 120px */
+ /*
+ such padding-left declaration is arbitrary and only serve to make the
+ test a bit more challenging.
+ */
+ }
- /* text-orientation property */
- .mixed {
- text-orientation: mixed;
- }
- .upright {
- text-orientation: upright;
- }
- .sideways-right {
- text-orientation: sideways-right;
- }
- .sideways-left {
- text-orientation: sideways-left;
- }
- .sideways {
- text-orientation: sideways;
- }
- .use-glyph-orientation {
- text-orientation: use-glyph-orientation;
- }
+ span.block-descendant
+ {
+ display: block;
+ }
+
+ span#first-line-box
+ {
+ color: yellow;
+ }
+
+ span#last-line-box
+ {
+ color: blue;
+ }
+
+ span#orange30
+ {
+ padding-right: 4em; /* computes to 120px */
+ font-size: 0.5em; /* computes to 30px */
+ /*
+ such padding-right declaration is arbitrary and only serve to make the
+ test a bit more challenging.
+ */
+ }
+ ]]></style>
- /* inline-block */
- .inline-block {
- display: inline-block;
- }
- .descendant-block {
- display: block;
- height: 1em;
- background-color: yellow;
- padding-left: 1em;
- padding-right: 1em;
- }
- ]]></style>
</head>
+
<body>
- <p>Test passes if ...</p>
- <ol>
- <li>the bottom of glyph 'L' and the bottom of yellow square is touching a thin blue line in each 7 orange rectangles and</li>
- <li>all 7 orange rectangles are <strong>identical</strong>.</li>
- </ol>
- <div id="control">
- <p>LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- </div>
+ <p>Test passes if 2 orange squares are centered with respect to a blue square.</p>
+
+ <div id="rl-upright">A<div id="inline-block">
+ <span class="block-descendant" id="first-line-box">I</span>
+ <span class="block-descendant" id="last-line-box">B</span>
+ </div><span id="orange30">O</span></div>
- <div class="horizontal-tb">
- <p class="mixed">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- <p class="upright">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- <p class="sideways-right">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- <p class="sideways-left">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- <p class="sideways">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- <p class="use-glyph-orientation">LLLLL<span class="inline-block">
- <span class="descendant-block"></span>
- <span class="descendant-block"></span>
- </span>LLLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p>
- </div>
</body>
</html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2025-05-28 11:42:24 +0000