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

Unified Diff: LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-025.xht

Issue 1161223002: Import csswg-test/css-writing-modes-3/ (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Comments updated Created 5 years, 7 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 side-by-side diff with in-line comments
Download patch
Index: LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-025.xht
diff --git a/LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-025.xht b/LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-025.xht
new file mode 100644
index 0000000000000000000000000000000000000000..64999a28d145b631ec3739949e5dc2677e294b92
--- /dev/null
+++ b/LayoutTests/imported/csswg-test/css-writing-modes-3/vertical-alignment-025.xht
@@ -0,0 +1,92 @@
+<!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>
+ <title>CSS Writing Modes Test: vertical align - 'negative percent (-20%)' (alphabetical baseline with horizontal 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" />
+ <link rel="match" href="vertical-alignment-025-ref.xht" />
+ <meta name="assert" content="This test checks the generation of text baseline with vertical align property. When 'writing-mode' is horizontal, then the alphabetical baseline is used as the dominant baseline." />
+ <meta name="flags" content="ahem image" />
+ <style type="text/css"><![CDATA[
+ div > p, p.control {
+ padding-bottom: 0.2em;
+ font: 40px/1 "Ahem";
+ background-color: orange;
+ }
+
+ /* vertical-align */
+ img {
+ vertical-align: -20%;
+ }
+ img.line {
+ margin-left: -260px;
+ }
+
+ /* writing-mode property */
+ .horizontal-tb {
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ /* text-orientation property */
+ .mixed {
+ -webkit-text-orientation: mixed;
+ }
+ .upright {
+ -webkit-text-orientation: upright;
+ }
+ .sideways-right {
+ -webkit-text-orientation: sideways-right;
+ }
+ .sideways-left {
+ -webkit-text-orientation: sideways-left;
+ }
+ .sideways {
+ -webkit-text-orientation: sideways;
+ }
+ .use-glyph-orientation {
+ -webkit-text-orientation: use-glyph-orientation;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if ...</p>
+ <ol>
+ <li>the bottom of black stripe is touching a thin blue line in each 7 orange rectangles.</li>
+ <li>the bottom edge of yellow square is aligned to a thin blue line in each 7 orange rectangles and</li>
+ <li>all 7 orange rectangles are <strong>identical</strong>.</li>
+ </ol>
+
+ <p class="control">CONTR
+ <img class="square" src="./support/yellow-square-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+
+ <div class="horizontal-tb">
+ <p class="mixed">MIXED
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ <p class="upright">UPRIG
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ <p class="sideways-right">SIDER
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ <p class="sideways-left">SIDEL
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ <p class="sideways">SIDEW
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ <p class="use-glyph-orientation">USEGL
+ <img class="square" src="./support/yellow-square-horiz-redline-bottom-59x59.png" alt="Image download support must be enabled" />
+ <img class="line" src="./support/blue-horiz-line-220x1.png" alt="Image download support must be enabled" />
+ </p>
+ </div>
+ </body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698