Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(101)

Side by Side Diff: LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-010.xht

Issue 1170703002: Import more CSS Writing Modes Level 3 test suites (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: TestExpetations Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/x html1/DTD/xhtml1-strict.dtd"> 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/x html1/DTD/xhtml1-strict.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head> 3 <head>
4 <title>CSS Writing Modes Test: vertical align - 'positive percentage (80%)' (alphabetical baseline with horizontal layout)</title> 4 <title>CSS Writing Modes Test: vertical align - 'zero length (0em)' (alphabe tical baseline with horizontal layout)</title>
5 <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmai l.com" /> 5 <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmai l.com" />
6 <link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/ css-writing-modes-3/#baseline-alignment" /> 6 <link rel="help" title="4.4. Baseline Alignment" href="http://www.w3.org/TR/ css-writing-modes-3/#baseline-alignment" />
7 <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" /> 7 <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" />
8 <link rel="match" href="vertical-alignment-022-ref.xht" /> 8 <link rel="match" href="vertical-alignment-010-ref.xht" />
9 <meta name="assert" content="This test checks the generation of text baselin e with vertical align property. When 'writing-mode' is horizontal, then the alph abetical baseline is used as the dominant baseline." /> 9 <meta name="assert" content="This test checks the generation of text baselin e with vertical align property. When 'writing-mode' is horizontal, then the alph abetical baseline is used as the dominant baseline." />
10 <meta name="flags" content="ahem image" /> 10 <meta name="flags" content="image" />
11 <style type="text/css"><![CDATA[ 11 <style type="text/css"><![CDATA[
12 div > p, p.control { 12 div > p, p.control {
13 font: 40px/1 "Ahem"; 13 font-size: 2em;
14 background-color: orange; 14 background-color: orange;
15 } 15 }
16 16
17 /* vertical-align */ 17 /* vertical-align */
18 img { 18 img {
19 vertical-align: 80%; 19 vertical-align: 0em;
20 } 20 }
21 img.line { 21 img.line {
22 margin-left: -260px; 22 margin-left: -230px;
23 } 23 }
24 24
25 /* writing-mode property */ 25 /* writing-mode property */
26 .horizontal-tb { 26 .horizontal-tb {
27 -webkit-writing-mode: horizontal-tb; 27 -webkit-writing-mode: horizontal-tb;
28 } 28 }
29 29
30 /* text-orientation property */ 30 /* text-orientation property */
31 .mixed { 31 .mixed {
32 -webkit-text-orientation: mixed; 32 -webkit-text-orientation: mixed;
(...skipping 11 matching lines...) Expand all
44 -webkit-text-orientation: sideways; 44 -webkit-text-orientation: sideways;
45 } 45 }
46 .use-glyph-orientation { 46 .use-glyph-orientation {
47 -webkit-text-orientation: use-glyph-orientation; 47 -webkit-text-orientation: use-glyph-orientation;
48 } 48 }
49 ]]></style> 49 ]]></style>
50 </head> 50 </head>
51 <body> 51 <body>
52 <p>Test passes if ...</p> 52 <p>Test passes if ...</p>
53 <ol> 53 <ol>
54 <li>the top of black stripe is touching a thin blue line in each 7 orange rectangles.</li> 54 <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</li>
55 <li>the bottom edge of yellow square is aligned to a thin blue line in eac h 7 orange rectangles and</li> 55 <li>the bottom edge of yellow square is aligned to a thin blue line in eac h 7 orange rectangles and</li>
56 <li>all 7 orange rectangles are <strong>identical</strong>.</li> 56 <li>all 7 orange rectangles are <strong>identical</strong>.</li>
57 </ol> 57 </ol>
58 58
59 <p class="control">CONTR 59 <p class="control">LLLLLLLLLL
60 <img class="square" src="./support/yellow-square-59x59.png" alt="Image dow nload support must be enabled" /> 60 <img class="square" src="./support/yellow-square-59x59.png" alt="Image dow nload support must be enabled" />
61 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image dow nload support must be enabled" /> 61 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image dow nload support must be enabled" />
62 </p> 62 </p>
63 63
64 <div class="horizontal-tb"> 64 <div class="horizontal-tb">
65 <p class="mixed">MIXED 65 <p class="mixed">LLLLLLLLLL
66 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 66 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
67 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 67 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
68 </p> 68 </p>
69 <p class="upright">UPRIG 69 <p class="upright">LLLLLLLLLL
70 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 70 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
71 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 71 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
72 </p> 72 </p>
73 <p class="sideways-right">SIDER 73 <p class="sideways-right">LLLLLLLLLL
74 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 74 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
75 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 75 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
76 </p> 76 </p>
77 <p class="sideways-left">SIDEL 77 <p class="sideways-left">LLLLLLLLLL
78 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 78 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
79 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 79 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
80 </p> 80 </p>
81 <p class="sideways">SIDEW 81 <p class="sideways">LLLLLLLLLL
82 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 82 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
83 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 83 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
84 </p> 84 </p>
85 <p class="use-glyph-orientation">USEGL 85 <p class="use-glyph-orientation">LLLLLLLLLL
86 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" /> 86 <img class="square" src="./support/yellow-square-horiz-redline-bottom-59 x59.png" alt="Image download support must be enabled" />
87 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" /> 87 <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image d ownload support must be enabled" />
88 </p> 88 </p>
89 </div> 89 </div>
90 </body> 90 </body>
91 </html> 91 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698