diff options
Diffstat (limited to 'tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1')
929 files changed, 52641 insertions, 0 deletions
diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-003.xht new file mode 100644 index 00000000000..a8ed205ed59 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-003.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, §10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-005.xht new file mode 100644 index 00000000000..cd4f32e4243 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-005.xht @@ -0,0 +1,110 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block + +CSS2.1, §10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 0px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 0px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-007.xht new file mode 100644 index 00000000000..4518c324c66 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-007.xht @@ -0,0 +1,120 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-009.xht new file mode 100644 index 00000000000..6e4b08f83d0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-009.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-011.xht new file mode 100644 index 00000000000..b5abf5866ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-011.xht @@ -0,0 +1,109 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-013.xht new file mode 100644 index 00000000000..f1d4d6192a7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-013.xht @@ -0,0 +1,119 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-015.xht new file mode 100644 index 00000000000..d0bc43b2a76 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-015.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' are 'auto' and bottom is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-017.xht new file mode 100644 index 00000000000..ce8d7304a45 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-017.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-019.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-019.xht new file mode 100644 index 00000000000..f78e2f70dbb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-019.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-021.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-021.xht new file mode 100644 index 00000000000..a04f995d9e6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-021.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-023.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-023.xht new file mode 100644 index 00000000000..aaac4769d41 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-023.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-025.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-025.xht new file mode 100644 index 00000000000..d33d34d85f2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-025.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-027.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-027.xht new file mode 100644 index 00000000000..1f395847c5c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-027.xht @@ -0,0 +1,111 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-029.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-029.xht new file mode 100644 index 00000000000..195966cad83 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-029.xht @@ -0,0 +1,105 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'left' to the static position and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-031.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-031.xht new file mode 100644 index 00000000000..92b52a31c9e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-031.xht @@ -0,0 +1,116 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-033.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-033.xht new file mode 100644 index 00000000000..81e2fb00a29 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-033.xht @@ -0,0 +1,111 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-035.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-035.xht new file mode 100644 index 00000000000..ec2d0e92314 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-035.xht @@ -0,0 +1,105 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'right' to the static position and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +And so computed left value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-037.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-037.xht new file mode 100644 index 00000000000..13ca8f9de54 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-037.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-039.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-039.xht new file mode 100644 index 00000000000..7ccab239647 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-039.xht @@ -0,0 +1,112 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-041.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-041.xht new file mode 100644 index 00000000000..b0396a40374 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-041.xht @@ -0,0 +1,106 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-043.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-043.xht new file mode 100644 index 00000000000..24233ffa6e5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-043.xht @@ -0,0 +1,116 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-045.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-045.xht new file mode 100644 index 00000000000..b5f1d35507d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-045.xht @@ -0,0 +1,112 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-047.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-047.xht new file mode 100644 index 00000000000..e93a55b8fd9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-047.xht @@ -0,0 +1,106 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-lr; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-049.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-049.xht new file mode 100644 index 00000000000..dda50bbe5a4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-049.xht @@ -0,0 +1,116 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px: top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px: top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-051.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-051.xht new file mode 100644 index 00000000000..fc44c513d7a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-051.xht @@ -0,0 +1,90 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* + +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-053.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-053.xht new file mode 100644 index 00000000000..70d74f35d9d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-053.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 1em; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed left value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-055.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-055.xht new file mode 100644 index 00000000000..7f8e0efd115 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-055.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-057.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-057.xht new file mode 100644 index 00000000000..d63156fd741 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-057.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-059.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-059.xht new file mode 100644 index 00000000000..d07d26826ab --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-059.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left', then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 1em; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +4.'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed left value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-061.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-061.xht new file mode 100644 index 00000000000..098fcee82f7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-061.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-063.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-063.xht new file mode 100644 index 00000000000..336c4ee1146 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-063.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-065.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-065.xht new file mode 100644 index 00000000000..5da25c9745a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-065.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + position: absolute; + right: 1em; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right: auto + ===================== + 320px : width of containing block + +And so computed width value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-067.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-067.xht new file mode 100644 index 00000000000..130edc5cf8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-067.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-069.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-069.xht new file mode 100644 index 00000000000..f36993616c3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-069.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-071.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-071.xht new file mode 100644 index 00000000000..a6ddcfc6589 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-071.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + position: absolute; + right: 1em; + width: auto; + writing-mode: vertical-lr; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed width value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-073.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-073.xht new file mode 100644 index 00000000000..b8b3ceec799 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-073.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-075.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-075.xht new file mode 100644 index 00000000000..7699661c741 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-075.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-077.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-077.xht new file mode 100644 index 00000000000..06959338011 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-077.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-079.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-079.xht new file mode 100644 index 00000000000..176ecac39e8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-079.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-081.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-081.xht new file mode 100644 index 00000000000..363815bf7c2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-081.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-083.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-083.xht new file mode 100644 index 00000000000..d8582d07ea8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-083.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'" /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-085.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-085.xht new file mode 100644 index 00000000000..fd29ffb026e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-085.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-087.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-087.xht new file mode 100644 index 00000000000..e6f3bb42816 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-087.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + (solve) : bottom + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-089.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-089.xht new file mode 100644 index 00000000000..6f80495c638 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-089.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained), then ignore 'right' and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + margin-left: 0em; + margin-right: 0em; + position: absolute; + right: 2em; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-091.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-091.xht new file mode 100644 index 00000000000..2de1fc6c63e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-091.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-007-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + (solve) : bottom + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-093.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-093.xht new file mode 100644 index 00000000000..31c626727aa --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-093.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-lr; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-095.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-095.xht new file mode 100644 index 00000000000..7fa6ecba6ea --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-095.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left', 'width' and 'right' are not 'auto' and if the values are overconstrained, then ignore 'left' and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + margin-left: 0em; + margin-right: 0em; + position: absolute; + right: 2em; + width: 1em; + writing-mode: vertical-lr; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-097.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-097.xht new file mode 100644 index 00000000000..806a6999cd5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vlr-097.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-002.xht new file mode 100644 index 00000000000..97b36c976b5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-002.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-004.xht new file mode 100644 index 00000000000..744e1b8d9b8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-004.xht @@ -0,0 +1,109 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 0px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 0px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-006.xht new file mode 100644 index 00000000000..fbeedbac8db --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-006.xht @@ -0,0 +1,119 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 0px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-008.xht new file mode 100644 index 00000000000..f132e71fe5e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-008.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-010.xht new file mode 100644 index 00000000000..1b21e0216fe --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-010.xht @@ -0,0 +1,109 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-012.xht new file mode 100644 index 00000000000..97631f21a03 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-012.xht @@ -0,0 +1,119 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +If all three of 'left', 'width', and 'right' are 'auto': First set any 'auto' values for 'margin-left' and 'margin-right' to 0. Then, if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position and apply rule number three below; otherwise, set 'right' to the static position and apply rule number one below. +" + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 0px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 240px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-014.xht new file mode 100644 index 00000000000..7e392c9106f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-014.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-016.xht new file mode 100644 index 00000000000..fb94d7d4ec9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-016.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-003-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 2em; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-018.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-018.xht new file mode 100644 index 00000000000..f435221e618 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-018.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-020.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-020.xht new file mode 100644 index 00000000000..93c49bb7c5e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-020.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-022.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-022.xht new file mode 100644 index 00000000000..86eaa7a8de3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-022.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 2em; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-024.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-024.xht new file mode 100644 index 00000000000..6c68452b224 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-024.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: auto; + position: absolute; + top: auto; + } + +/* +" +set 'auto' values for 'margin-left' and 'margin-right' to 0, and pick the one of the following six rules that applies. + +1. 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width is shrink-to-fit. Then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-026.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-026.xht new file mode 100644 index 00000000000..66b53125cfd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-026.xht @@ -0,0 +1,111 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-028.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-028.xht new file mode 100644 index 00000000000..830f87cdb84 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-028.xht @@ -0,0 +1,105 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'left' to the static position and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-030.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-030.xht new file mode 100644 index 00000000000..8f8cf76bd75 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-030.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 160px : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-032.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-032.xht new file mode 100644 index 00000000000..78a1e516299 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-032.xht @@ -0,0 +1,111 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom: auto + ===================== + 320px : height of containing block + +And so computed top value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-034.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-034.xht new file mode 100644 index 00000000000..61b144fdede --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-034.xht @@ -0,0 +1,105 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'right' to the static position and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +gives us: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right: auto + ===================== + 320px : width of containing block + +And so computed left value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-036.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-036.xht new file mode 100644 index 00000000000..f013c0e48d5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-036.xht @@ -0,0 +1,115 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +2. 'left' and 'right' are 'auto' and 'width' is not 'auto', then if the 'direction' property of the element establishing the static-position containing block is 'ltr' set 'left' to the static position, otherwise set 'right' to the static position. Then solve for 'left' (if 'direction is 'rtl') or 'right' (if 'direction' is 'ltr'). +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-038.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-038.xht new file mode 100644 index 00000000000..e47b258ec9b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-038.xht @@ -0,0 +1,112 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-040.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-040.xht new file mode 100644 index 00000000000..eb4f5edbd64 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-040.xht @@ -0,0 +1,106 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-rl; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-042.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-042.xht new file mode 100644 index 00000000000..024bc0d27e9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-042.xht @@ -0,0 +1,116 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-044.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-044.xht new file mode 100644 index 00000000000..fd5c7b2a97d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-044.xht @@ -0,0 +1,112 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-046.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-046.xht new file mode 100644 index 00000000000..750c19ff020 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-046.xht @@ -0,0 +1,106 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: auto; + writing-mode: vertical-rl; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +gives us: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-048.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-048.xht new file mode 100644 index 00000000000..f286aed55a5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-048.xht @@ -0,0 +1,116 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: auto; + position: absolute; + top: 1em; + } + +/* + +" +3. 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width is shrink-to-fit . Then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +gives us: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : (shrink-to-fit) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-050.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-050.xht new file mode 100644 index 00000000000..6b702e4d566 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-050.xht @@ -0,0 +1,90 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* + +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-052.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-052.xht new file mode 100644 index 00000000000..4c5c6674cb6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-052.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 1em; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed left value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-054.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-054.xht new file mode 100644 index 00000000000..b4f36d2a74c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-054.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-056.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-056.xht new file mode 100644 index 00000000000..f984c6f1b24 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-056.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-058.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-058.xht new file mode 100644 index 00000000000..1f27016070e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-058.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left', then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: auto; + position: absolute; + right: 1em; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +4.'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + (solve) : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed left value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-060.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-060.xht new file mode 100644 index 00000000000..8e15b48505a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-060.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: 1em; + position: absolute; + top: auto; + } + +/* +" +4. 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + (solve) : top: auto + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 160px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-062.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-062.xht new file mode 100644 index 00000000000..4c66a65c176 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-062.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-064.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-064.xht new file mode 100644 index 00000000000..7b8e938f001 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-064.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + position: absolute; + right: 1em; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left: auto + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right: auto + ===================== + 320px : width of containing block + +And so computed width value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-066.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-066.xht new file mode 100644 index 00000000000..b37d0418a51 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-066.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-068.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-068.xht new file mode 100644 index 00000000000..d169c0c224d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-068.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-070.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-070.xht new file mode 100644 index 00000000000..793cfd38fca --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-070.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + position: absolute; + right: 1em; + width: auto; + writing-mode: vertical-rl; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : width: auto + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 80px : right + ===================== + 320px : width of containing block + +And so computed width value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-072.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-072.xht new file mode 100644 index 00000000000..a72417d3ef2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-072.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 1em; + color: green; + height: auto; + position: absolute; + top: 2em; + } + +/* +" +5. 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + (solve) : height: auto + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + 80px : bottom + ===================== + 320px : height of containing block + +And so computed height value must be 80px. +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-074.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-074.xht new file mode 100644 index 00000000000..6d39a1f3147 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-074.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-076.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-076.xht new file mode 100644 index 00000000000..a47c80558d2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-076.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-078.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-078.xht new file mode 100644 index 00000000000..ee7f0b1988a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-078.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-080.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-080.xht new file mode 100644 index 00000000000..9ae06a0bb81 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-080.xht @@ -0,0 +1,89 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-082.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-082.xht new file mode 100644 index 00000000000..e34af2c4708 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-082.xht @@ -0,0 +1,83 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'" /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 1em; + position: absolute; + right: auto; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 80px : left + + + 0px : margin-left: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-084.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-084.xht new file mode 100644 index 00000000000..6e2b26fa035 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-084.xht @@ -0,0 +1,93 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: auto; + color: green; + height: 1em; + position: absolute; + top: 1em; + } + +/* +" +6. 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right' +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 80px : top + + + 0px : margin-top: auto + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom: auto + + + (solve) : bottom: auto + ===================== + 320px : height of containing block + +And so computed bottom value must be 160px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-086.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-086.xht new file mode 100644 index 00000000000..e9a68a1e63d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-086.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-002-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + (solve) : bottom + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-088.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-088.xht new file mode 100644 index 00000000000..9c038c1c6ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-088.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained), then ignore 'right' and then solve for 'right'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + margin-left: 0em; + margin-right: 0em; + position: absolute; + right: 2em; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + (solve) : right: auto + ===================== + 320px : width of containing block + +And so computed right value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-090.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-090.xht new file mode 100644 index 00000000000..55dee4c43af --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-090.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-006-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-3row-320x320.png"); + color: transparent; + direction: ltr; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + (solve) : bottom + ===================== + 320px : height of containing block + +And so computed bottom value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-092.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-092.xht new file mode 100644 index 00000000000..827598addb9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-092.xht @@ -0,0 +1,113 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-004-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + writing-mode: vertical-rl; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-094.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-094.xht new file mode 100644 index 00000000000..808dd0e5e1d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-094.xht @@ -0,0 +1,107 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-009-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'left', 'width' and 'right' are not 'auto' and if the values are overconstrained, then ignore 'left' and then solve for 'left'." /> + + <style type="text/css"><![CDATA[ + div#containing-block + { + background: red url("support/bg-red-2col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + color: green; + left: 2em; + margin-left: 0em; + margin-right: 0em; + position: absolute; + right: 2em; + width: 1em; + writing-mode: vertical-rl; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +So: + + 160px : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right + + + 160px : right + ===================== + 320px : width of containing block + +gives us: + + (solve) : left + + + 0px : margin-left + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : width + + + 0px : padding-right + + + 0px : border-right-width + + + 0px : margin-right: auto + + + 160px : right + ===================== + 320px : width of containing block + +And so computed left value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-096.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-096.xht new file mode 100644 index 00000000000..d7d02e250e7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/abs-pos-non-replaced-vrl-096.xht @@ -0,0 +1,117 @@ +<!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: absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta name="flags" content="ahem image" /> + <meta name="assert" content="When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'." /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#containing-block + { + background: red url("support/bg-red-3col-2row-320x320.png"); + color: transparent; + direction: rtl; + font: 80px/1 Ahem; + height: 320px; + position: relative; + width: 320px; + } + + div#containing-block > span + { + background-color: red; + bottom: 2em; + color: green; + height: 1em; + margin-bottom: 0em; + margin-top: 0em; + position: absolute; + top: 2em; + } + +/* +" +If none of the three is 'auto': If both 'margin-left' and 'margin-right' are 'auto', solve the equation under the extra constraint that the two margins get equal values, unless this would make them negative, in which case when direction of the containing block is 'ltr' ('rtl'), set 'margin-left' ('margin-right') to zero and solve for 'margin-right' ('margin-left'). If one of 'margin-left' or 'margin-right' is 'auto', solve the equation for that value. If the values are over-constrained, ignore the value for 'left' (in case the 'direction' property of the containing block is 'rtl') or 'right' (in case 'direction' is 'ltr') and solve for that value. +" + +'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = width of containing block +CSS2.1, § 10.3.7 Absolutely positioned, non-replaced elements +http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width + +" +Layout rules that refer to the *-left and *-right box properties (border, margin, padding) use *-top and *-bottom instead, and vice versa. Which side of the box the property applies to doesn't change: only which values are inputs to which layout calculations changes. +" +7.1 Principles of Layout in Vertical Writing Modes +http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout + +So: + + 160px : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +gives us: + + (solve) : top + + + 0px : margin-top + + + 0px : border-top-width + + + 0px : padding-top + + + 80px : height + + + 0px : padding-bottom + + + 0px : border-bottom-width + + + 0px : margin-bottom + + + 160px : bottom + ===================== + 320px : height of containing block + +And so computed top value must be 80px; +*/ + + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div id="containing-block">1 2 34<span>X</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/autoheight-regions-in-autoheight-flexbox-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/autoheight-regions-in-autoheight-flexbox-002.xht new file mode 100644 index 00000000000..646256edca4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/autoheight-regions-in-autoheight-flexbox-002.xht @@ -0,0 +1,58 @@ +<!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 Regions: Auto-height regions with vertical writing mode in auto-height flexbox</title> + <link href="mailto:badea@adobe.com" rel="author" title="Catalin Badea" /> + <link href="http://www.w3.org/TR/css3-regions/#rfcb-flow-fragment-height-resolution" rel="help" /> + <link href="http://www.w3.org/TR/css-flexbox-1/#layout-algorithm" rel="help" /> + <link href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <meta content="ahem" name="flags" /> + <meta content="Test checks that auto-height regions having content with vertical writing mode are + sized correctly when placed inside a flex container. The flowed content should be displayed as a horizontal + green stripe." name="assert" /> + <link href="reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht" rel="match" /> + <style> + .content { + font-size: 20px; + line-height: 1em; + color: green; + font-family: Ahem; + flow-into: flow; + writing-mode: vertical-rl; + } + + .flexbox { + display: flex; + flex-flow: row; + } + + .region { + background-color: green; + flow-from: flow; + } + + .region > p { + background-color: red; + } + </style> + </head> + <body> + <ul> + <li>Test passes if you see a horizontal green stripe.</li> + <li>You shouldn't see any red.</li> + </ul> + <div class="content"> + XX<br /> + XX<br /> + XX<br /> + XX<br /> + XX + </div> + <div class="flexbox"> + <div class="region"> + <p> </p> + </div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-003.xht new file mode 100644 index 00000000000..ce4fbfba36e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-003.xht @@ -0,0 +1,46 @@ +<!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: 'background-position: left top' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left top; + background-repeat: repeat-x; + writing-mode: vertical-lr; + } + + div + { + margin-top: 99px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-002.png" width="333" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats + above and if one of the cats starts + <strong>exactly inside the top left corner</strong> of + the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-005.xht new file mode 100644 index 00000000000..06bdc2433a4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-005.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: left bottom' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left bottom' will make background-image start at lower right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left bottom; + background-repeat: repeat-x; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-004.png" width="397" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats at the + bottom of the page and if one of the cats + starts <strong>exactly inside the top left corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-007.xht new file mode 100644 index 00000000000..62bcbd60609 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-007.xht @@ -0,0 +1,47 @@ +<!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: 'background-position: right top' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right top; + background-repeat: repeat-x; + width: 100%; + writing-mode: vertical-lr; + } + + div + { + margin-top: 99px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-006.png" width="343" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats + above and if one of the cats starts + <strong>exactly inside the top right corner</strong> of + the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-009.xht new file mode 100644 index 00000000000..9e2afcb0389 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-009.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'background-position: right bottom' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right bottom; + background-repeat: repeat-x; + width: 100%; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + + <div><img src="support/pass-cdts-bg-pos-vrl-008.png" width="399" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats at the + bottom of the page and if one of the cats starts + <strong>exactly inside the bottom right corner</strong> of + the page. This should remain true even after + resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-011.xht new file mode 100644 index 00000000000..455171d8913 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-011.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: left top' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left top; + background-repeat: repeat-y; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-010.png" width="465" height="94" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on + the left of the page and if one of the cats + starts <strong>exactly inside the top left corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-013.xht new file mode 100644 index 00000000000..de142a08c3d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-013.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: left bottom' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left bottom; + background-repeat: repeat-y; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-012.png" width="483" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on the + left of the page and if one of the cats starts + <strong>exactly inside the bottom left corner</strong> of + the page. This should remain true even after + resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-015.xht new file mode 100644 index 00000000000..c719640f0ed --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-015.xht @@ -0,0 +1,42 @@ +<!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: 'background-position: right top' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right top; + background-repeat: repeat-y; + width: 100%; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-014.png" width="484" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on + the right of the page and if one of the cats + starts <strong>exactly inside the top right corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-017.xht new file mode 100644 index 00000000000..2e32467617e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vlr-017.xht @@ -0,0 +1,42 @@ +<!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: 'background-position: right bottom' and 'vertical-lr'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right bottom; + background-repeat: repeat-y; + width: 100%; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-016.png" width="518" height="92" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on the + right of the page and if one of the cats starts + <strong>exactly inside the bottom right corner</strong> of the + page. This should remain true even after resizing + the window.</div> +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-002.xht new file mode 100644 index 00000000000..dd0dadb1859 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-002.xht @@ -0,0 +1,47 @@ +<!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: 'background-position: left top' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left top; + background-repeat: repeat-x; + width: 100%; + writing-mode: vertical-rl; + } + + div + { + margin-top: 99px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-002.png" width="333" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats + above and if one of the cats starts + <strong>exactly inside the top left corner</strong> of + the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-004.xht new file mode 100644 index 00000000000..f69f38cd91f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-004.xht @@ -0,0 +1,42 @@ +<!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: 'background-position: left bottom' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left bottom; + background-repeat: repeat-x; + width: 100%; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-004.png" width="397" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats at the + bottom of the page and if one of the cats + starts <strong>exactly inside the top left corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-006.xht new file mode 100644 index 00000000000..328b86c8bb3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-006.xht @@ -0,0 +1,46 @@ +<!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: 'background-position: right top' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right top; + background-repeat: repeat-x; + writing-mode: vertical-rl; + } + + div + { + margin-top: 99px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-006.png" width="343" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats + above and if one of the cats starts + <strong>exactly inside the top right corner</strong> of + the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-008.xht new file mode 100644 index 00000000000..f5276ca2d7e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-008.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: right bottom' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right bottom; + background-repeat: repeat-x; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-008.png" width="399" height="93" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a row of cats at the + bottom of the page and if one of the cats starts + <strong>exactly inside the bottom right corner</strong> of + the page. This should remain true even after + resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-010.xht new file mode 100644 index 00000000000..560c1768ac6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-010.xht @@ -0,0 +1,42 @@ +<!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: 'background-position: left top' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left top; + background-repeat: repeat-y; + width: 100%; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-010.png" width="465" height="94" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on + the left of the page and if one of the cats + starts <strong>exactly inside the top left corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-012.xht new file mode 100644 index 00000000000..a02f6729ed0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-012.xht @@ -0,0 +1,42 @@ +<!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: 'background-position: left bottom' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: left bottom; + background-repeat: repeat-y; + width: 100%; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-012.png" width="483" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on the + left of the page and if one of the cats starts + <strong>exactly inside the bottom left corner</strong> of + the page. This should remain true even after + resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-014.xht new file mode 100644 index 00000000000..ba7eee59de1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-014.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: right top' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right top; + background-repeat: repeat-y; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-014.png" width="484" height="95" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on + the right of the page and if one of the cats + starts <strong>exactly inside the top right corner</strong> + of the page. This should remain true even + after resizing the window. +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-016.xht new file mode 100644 index 00000000000..4434aeca06b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/background-position-vrl-016.xht @@ -0,0 +1,41 @@ +<!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: 'background-position: right bottom' and 'vertical-rl'</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/#physical-only" title="7.6 Purely Physical Mappings" /> + + <meta content="image interact" name="flags" /> + <meta content="This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + background-color: white; + background-image: url("support/cat.png"); + background-position: right bottom; + background-repeat: repeat-y; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-bg-pos-vrl-016.png" width="518" height="92" alt="Image download support must be enabled" /></div> + +<!-- + The image says: + + Test passes if there is a column of cats on the + right of the page and if one of the cats starts + <strong>exactly inside the bottom right corner</strong> of the + page. This should remain true even after resizing + the window.</div> +--> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-002.xht new file mode 100644 index 00000000000..af1666ce6c2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-002.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + span + { + border-right: green solid 1em; + display: inline-block; + height: 2em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div> + <span></span> + TL + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-003.xht new file mode 100644 index 00000000000..21b0c9c98fd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-003.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + span + { + border-left: green solid 1em; + display: inline-block; + height: 2em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div> + TL + <span></span> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-004.xht new file mode 100644 index 00000000000..f72623d755c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-004.xht @@ -0,0 +1,42 @@ +<!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: baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + span + { + display: inline-block; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div> + <span>FZ</span> + TL + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-005.xht new file mode 100644 index 00000000000..ba03bb7b3ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-non-replaced-005.xht @@ -0,0 +1,42 @@ +<!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: baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + span + { + display: inline-block; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div> + TL + <span>FZ</span> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-002.xht new file mode 100644 index 00000000000..294756ca0d9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-002.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: baseline-alignment of inline replaced element and 'vertical-rl'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/baseline-inline-replaced-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + font: 6em/1 Ahem; /* computes to 96px/96px */ + height: 99px; /* the height of the cat image */ + writing-mode: vertical-rl; + } + + img + { + vertical-align: baseline; + } + /* In vertical writing mode, the central baseline is used as the dominant baseline; + here, the central baseline is assumed to be halfway between the under and over + logical margin edges of the inline replaced element box. */ + + /* cat.png has an intrinsic height of 99px and an intrinsic width of 98px */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a cat and <strong>no red</strong>.</p> + + <div><img src="support/cat.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-003.xht new file mode 100644 index 00000000000..16b76f5afc4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/baseline-inline-replaced-003.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: baseline-alignment of inline replaced element and 'vertical-lr'</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/baseline-inline-replaced-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-lr' is 'central' and not 'alphabetic'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: red; + font: 6em/1 Ahem; /* computes to 96px/96px */ + height: 99px; /* the height of the cat image */ + writing-mode: vertical-lr; + } + + img + { + vertical-align: baseline; + } + /* In vertical writing mode, the central baseline is used as the dominant baseline; + here, the central baseline is assumed to be halfway between the under and over + logical margin edges of the inline replaced element box. */ + + /* cat.png has an intrinsic height of 99px and an intrinsic width of 98px */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a cat and <strong>no red</strong>.</p> + + <div><img src="support/cat.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-001.xht new file mode 100644 index 00000000000..b9675c57ca2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi embed (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>a > א</span> ></div> + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-002.xht new file mode 100644 index 00000000000..41b4a7edf97 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi embed (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>א > a</span> ></div> + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-003.xht new file mode 100644 index 00000000000..3be14a8c5c6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi embed (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>א > a</span> ></div> + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-004.xht new file mode 100644 index 00000000000..ab9885e653f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi embed (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>a > א</span> ></div> + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-005.xht new file mode 100644 index 00000000000..9a1fae57a86 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi embed, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-005.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, that element will interact with the surrounding text like a strongly directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>א > ב</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭d < b > c < a‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-006.xht new file mode 100644 index 00000000000..427c29c0bae --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi embed, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-006.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, that element will interact with the surrounding text like a strongly directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr"> א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ג < ב > ד‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-007.xht new file mode 100644 index 00000000000..a404e10e046 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-007.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> 3</div> + + +<div class="ref" dir="ltr">‭3 א‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-008.xht new file mode 100644 index 00000000000..d88cf580f0b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-008.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> 3</div> + + +<div class="ref" dir="rtl">‭a 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-009.xht new file mode 100644 index 00000000000..4d03c9d9564 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-009.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> > b</div> + + +<div class="ref" dir="rtl">‭a > b</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-010.xht new file mode 100644 index 00000000000..dc03f50667e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-010.xht" rel="match" /> +<meta content="If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> > ב</div> + + +<div class="ref" dir="ltr">‭ב < א</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-011.xht new file mode 100644 index 00000000000..552d879c604 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-embed-011.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, unicode-bidi embed</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-011.xht" rel="match" /> +<meta content="Directionality is not changed by the direction property on its own, but unicode-bidi: embed will apply direction declared on a higher level element." name="assert" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <b>a > <span>b > ד</span> > d</b> ></div> + + +<div class="ref" dir="ltr">‭> a > ד < b > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-001.xht new file mode 100644 index 00000000000..a08fc32fbca --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>a > א</span> ></div> + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-002.xht new file mode 100644 index 00000000000..72452342260 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>א > a</span> ></div> + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-003.xht new file mode 100644 index 00000000000..8a651acfae6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>א > a</span> ></div> + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-004.xht new file mode 100644 index 00000000000..ef18cd6731e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>a > א</span> ></div> + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-005.xht new file mode 100644 index 00000000000..2dd233e85ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi isolate, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-005.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>א > ב</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-006.xht new file mode 100644 index 00000000000..d991ae62285 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi isolate, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-006.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr">א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-007.xht new file mode 100644 index 00000000000..a2bd200eabb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-007.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> 3</div> + +<div class="ref">‭א 3‬</div> + + + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-008.xht new file mode 100644 index 00000000000..de376867aec --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-008.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> 3</div> + + +<div class="ref" dir="rtl">‭3 a‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-009.xht new file mode 100644 index 00000000000..6db456c5431 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-009.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> > b</div> + + +<div class="ref" dir="rtl">‭b < a</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-010.xht new file mode 100644 index 00000000000..9186d9b29fd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-010.xht" rel="match" /> +<meta content="If unicode-bidi:isolate is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> > ב</div> + + +<div class="ref" dir="ltr">‭א > ב</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-011.xht new file mode 100644 index 00000000000..93e478f0859 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-011.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, unicode-bidi embed</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-011.xht" rel="match" /> +<meta content="Directionality is not changed by the direction property on its own, but unicode-bidi: isolate will apply direction declared on a higher level element." name="assert" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <b>a > <span>b > ד</span> > d</b> ></div> + + +<div class="ref" dir="ltr">‭> a > ד < b > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-001.xht new file mode 100644 index 00000000000..ab38b9fc204 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, isolate-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-002.xht new file mode 100644 index 00000000000..4c5d7d4b884 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, isolate-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>אבגד > abcd</span> ></div> + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-003.xht new file mode 100644 index 00000000000..4a7704d2ddd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, isolate-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>אבגד > abcd</span> ></div> + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-004.xht new file mode 100644 index 00000000000..fc488a3f3e4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, isolate-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-005.xht new file mode 100644 index 00000000000..83921cfa0ff --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with isolate-override, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-005.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>ב > ג</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ג < ב > d‬</div> + <div dir="rtl">‭a > c < b > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-006.xht new file mode 100644 index 00000000000..e93efd25fcd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with isolate-override, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-006.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr"> א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ב > ג < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-007.xht new file mode 100644 index 00000000000..ddc9476e736 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-007.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>אבגד</span> 3</div> + + +<div class="ref" dir="ltr">‭דגבא 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-008.xht new file mode 100644 index 00000000000..922262bb346 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-008.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>abcd</span> 3</div> + + +<div class="ref" dir="rtl">‭3 abcd‬</div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-009.xht new file mode 100644 index 00000000000..40fce81c015 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-009.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>abcd</span> > e</div> + + +<div class="ref" dir="rtl">‭e < abcd‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-010.xht new file mode 100644 index 00000000000..5cee4732029 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-010.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>אבגד</span> > ה</div> + + +<div class="ref" dir="ltr">‭דגבא > ה‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-011.xht new file mode 100644 index 00000000000..6d6571b5af5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-011.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, isolate-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-011.xht" rel="match" /> +<meta content="unicode-bidi: isolate-override will apply direction declared on a higher level element." name="assert" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <b>a > <span>bc > בג</span> > d</b> ></div> + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-012.xht new file mode 100644 index 00000000000..ff615aa143f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-isolate-override-012.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: default direction, isolate-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-isolate-override-012.xht" rel="match" /> +<meta content="unicode-bidi: When no direction is set, isolate-override will apply ltr ordering to text within its scope." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-001.xht new file mode 100644 index 00000000000..666b6f144b1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi normal (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>a > א</span> ></div> + + +<div class="ref" dir="ltr">‭> a > א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-002.xht new file mode 100644 index 00000000000..5bae178cefd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi normal (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>א > a</span> ></div> + + +<div class="ref" dir="ltr">‭> א > a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-003.xht new file mode 100644 index 00000000000..8eec9913ebd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi normal (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>א > a</span> ></div> + + +<div class="ref" dir="rtl">‭< a < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-004.xht new file mode 100644 index 00000000000..3cfe7d7127e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi normal (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>a > א</span> ></div> + + +<div class="ref" dir="rtl">‭< א < a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-005.xht new file mode 100644 index 00000000000..16ee8c6c25f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi normal, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-005.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>א > ב</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-006.xht new file mode 100644 index 00000000000..848c39b9a2d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi normal, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-006.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr"> א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-007.xht new file mode 100644 index 00000000000..32bca74a533 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-007.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> 3</div> + + +<div class="ref" dir="ltr">‭3 א‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-008.xht new file mode 100644 index 00000000000..c64cbe018f4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-008.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> 3</div> + + +<div class="ref" dir="rtl">‭a 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-009.xht new file mode 100644 index 00000000000..5b0baa224c5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-009.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> > b</div> + + +<div class="ref" dir="rtl">‭a > b</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-010.xht new file mode 100644 index 00000000000..44f89bc4cda --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-010.xht" rel="match" /> +<meta content="If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> > ב</div> + + +<div class="ref" dir="ltr">‭ב < א</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-011.xht new file mode 100644 index 00000000000..259ca2ddc24 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-normal-011.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, unicode-bidi normal</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-embed-011.xht" rel="match" /> +<meta content="Directionality is not changed by the direction property on its own, nor by unicode-bidi:normal set on a lower level element." name="assert" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <b>a > <span>b > ד</span> > d</b> ></div> + + +<div class="ref" dir="ltr">‭> a > b > ד > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-001.xht new file mode 100644 index 00000000000..b6356e01b2c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, bidi-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-002.xht new file mode 100644 index 00000000000..29bee966601 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, bidi-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>אבגד > abcd</span> ></div> + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-003.xht new file mode 100644 index 00000000000..b7e821c6032 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, bidi-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>אבגד > abcd</span> ></div> + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-004.xht new file mode 100644 index 00000000000..34708254e61 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, bidi-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-005.xht new file mode 100644 index 00000000000..79a3ebfc3c2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with bidi-override, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-005.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, that element will interact with the surrounding text like a strongly directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>ב > ג</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ג < ב < a‬</div> + <div dir="rtl">‭d < c < b < a‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-006.xht new file mode 100644 index 00000000000..cf058e196d1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with bidi-override, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-006.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, that element will interact with the surrounding text like a strongly directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr"> א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ב > ג > ד‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-007.xht new file mode 100644 index 00000000000..527ee3f1627 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-007.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>abcd</span> 3</div> + + +<div class="ref" dir="ltr">‭3 dcba‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-008.xht new file mode 100644 index 00000000000..e17487d8332 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-008.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>אבגד</span> 3</div> + + +<div class="ref" dir="rtl">‭אבגד 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-009.xht new file mode 100644 index 00000000000..80cc022d506 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-009.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>אבגד</span> > e</div> + + +<div class="ref" dir="rtl">‭אבגד > e‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-010.xht new file mode 100644 index 00000000000..0791076818d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-010.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>abcd</span> > ה</div> + + +<div class="ref" dir="ltr">‭ה < dcba‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-011.xht new file mode 100644 index 00000000000..7c4e00218be --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-011.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, bidi-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-011.xht" rel="match" /> +<meta content="unicode-bidi: bidi-override will apply direction declared on a higher level element." name="assert" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <b>a > <span>bc > בג</span> > d</b> ></div> + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-012.xht new file mode 100644 index 00000000000..d610c661daf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-override-012.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: default direction, bidi-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-override-012.xht" rel="match" /> +<meta content="unicode-bidi: When no direction is set, bidi-override will apply ltr ordering to text within its scope." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> <span>abcd > אבגד</span> ></div> + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-001.xht new file mode 100644 index 00000000000..a23bcea2121 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, rtl (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-001.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is rtl, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>א > b > ג</span> ></div> + +<div class="ref" dir="ltr">‭> ג < b < א >‬</div> + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-002.xht new file mode 100644 index 00000000000..d22f4561f81 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-002.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span unicode-bidi plaintext, rtl (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-002.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is rtl, the text in that element will be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>א > b > ג</span> ></div> + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-003.xht new file mode 100644 index 00000000000..1d9bd7d12a3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, ltr (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-003.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is ltr, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>a > א > c</span> ></div> + + +<div class="ref" dir="rtl">‭< a > א > c <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-004.xht new file mode 100644 index 00000000000..6494b60c282 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, ltr (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-004.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is ltr, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>a > א > c</span> ></div> + + +<div class="ref" dir="ltr">‭> a > א > c >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-005.xht new file mode 100644 index 00000000000..0597ab26c00 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element as directional character with unicode-bidi plaintext, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-005.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>א > ב</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-006.xht new file mode 100644 index 00000000000..3139ee0ef3f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi plaintext, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-006.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, that element will interact with the surrounding text like a neutral directional character." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr">א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-007.xht new file mode 100644 index 00000000000..011c376349c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-007.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-007.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> 3</div> + + +<div class="ref" dir="ltr">‭א 3‬</div> + + + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-008.xht new file mode 100644 index 00000000000..b9a0852cb66 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-008.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> 3</div> + + +<div class="ref" dir="rtl">‭3 a‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-009.xht new file mode 100644 index 00000000000..381d5be25b6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-009.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> > b</div> + + +<div class="ref" dir="rtl">‭b < a</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-010.xht new file mode 100644 index 00000000000..0008efa2836 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-010.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> > ב</div> + + +<div class="ref" dir="ltr">‭א > ב</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-011.xht new file mode 100644 index 00000000000..a1c44f7e201 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-plaintext-011.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span unicode-bidi plaintext, no strong (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-plaintext-002.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with no strong directional character, the text in that element will be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>> ></span> ></div> + +<div class="ref" dir="rtl">‭< > > <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-table-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-table-001.xht new file mode 100644 index 00000000000..e0e7a8bc176 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-table-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: table columns</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<meta content="If direction is applied to the ancestor of a table element, columns will be displayed in that direction." name="assert" /> +<style type="text/css"> +.test { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if you see two lines reading c b a.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> + + +<div class="test"> +<table><tbody> +<tr><td>a</td><td>b</td><td>c</td></tr> +<tr><td>a</td><td>b</td><td>c</td></tr> +</tbody></table> +</div> + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-001.xht new file mode 100644 index 00000000000..eed16ff5867 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi unset (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-001.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>a > א</span> ></div> + + +<div class="ref" dir="ltr">‭> a > א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-002.xht new file mode 100644 index 00000000000..d362fc2a46c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi unset (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-002.xht" rel="match" /> +<meta content="In a ltr context, if direction:rtl is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr">> <span>א > a</span> ></div> + + +<div class="ref" dir="ltr">‭> א > a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-003.xht new file mode 100644 index 00000000000..e1f7daa7986 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi unset (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-003.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>א > a</span> ></div> + + +<div class="ref" dir="rtl">‭< a < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-004.xht new file mode 100644 index 00000000000..7c87bdd435d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-004.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi unset (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-004.xht" rel="match" /> +<meta content="In a rtl context, if direction:ltr is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl">> <span>a > א</span> ></div> + + +<div class="ref" dir="rtl">‭< א < a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-005.xht new file mode 100644 index 00000000000..7468e3d5590 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-005.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi unset, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-005.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="rtl">a > <span>א > ב</span> > d</div> + <div dir="rtl">a > <span>b > c</span> > d</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-006.xht new file mode 100644 index 00000000000..3e587ae3058 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-006.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi unset, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-006.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test"><div dir="ltr">א > <span>b > c</span> > ד</div> + <div dir="ltr"> א > <span>ב > ג</span> > ד</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-007.xht new file mode 100644 index 00000000000..f3c20232006 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-007.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi unset, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-007.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> 3</div> + + +<div class="ref" dir="ltr">‭3 א‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-008.xht new file mode 100644 index 00000000000..7829b5142c8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-008.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi unset, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-008.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from surrounding text." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> 3</div> + + +<div class="ref" dir="rtl">‭a 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-009.xht new file mode 100644 index 00000000000..d41884e1967 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-009.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi unset, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-009.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="rtl"><span>a</span> > b</div> + + +<div class="ref" dir="rtl">‭a > b</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-010.xht new file mode 100644 index 00000000000..916f240cdbd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/bidi-unset-010.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi unset, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/bidi-normal-010.xht" rel="match" /> +<meta content="If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from following content." name="assert" /> +<style type="text/css"> +.test span { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test" dir="ltr"><span>א</span> > ב</div> + + +<div class="ref" dir="ltr">‭ב < א</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-001.xht new file mode 100644 index 00000000000..82e8cb288ed --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-embed-001.xht" rel="match" /> +<meta content="If direction is applied to a block element containing mixed direction text, the text in that element will be displayed in the expected order." name="assert" /> +<style type="text/css"> +.test { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> a > ב > c ></div> + + +<div class="ref" dir="rtl">‭< c < ב < a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-002.xht new file mode 100644 index 00000000000..e8dc97fd1b7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-embed-002.xht" rel="match" /> +<meta content="If direction is applied to a block element containing mixed direction text, the text in that element will be displayed in the expected order." name="assert" /> +<style type="text/css"> +.test { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="test">> a > ב > c ></div> + +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-003.xht new file mode 100644 index 00000000000..139f7a155b7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-embed-003.xht @@ -0,0 +1,51 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-embed-003.xht" rel="match" /> +<meta content="If direction is applied to a block element, contained block elements inherit that direction." name="assert" /> +<style type="text/css"> +.test { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +<div>> a > ב > c ></div> +<div>> a > ב > c ></div> +</div> + +<div class="ref"> +<div dir="rtl">‭< c < ב < a <‬</div> +<div dir="rtl">‭< c < ב < a <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-001.xht new file mode 100644 index 00000000000..aa690b95c66 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-001.xht @@ -0,0 +1,61 @@ +<!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: horizontal-tb - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that block-level boxes in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of a containing block; they are ordered from top to bottom meaning that the 1st block box is the topmost one, then the 2nd block is juxtaposed at its bottom, then the 3rd block is juxtaposed to the 2nd block at its bottom, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + html { writing-mode: horizontal-tb; } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + width: 21em; + } + + div + { + background-color: blue; + border-left: blue solid 1em; + border-right: blue solid 1em; + } + + div#top-border { border-top: blue solid 1em; } + + div#bottom-border { border-bottom: blue solid 1em; } + ]]></style> + </head> + + <body> + + <!-- topmost line --><div id="top-border">AAAA BBBB CCCC DDDD</div> + + <!-- 2nd topmost line --><div>E F G H J L </div> + + <!-- 3rd topmost line --><div>M N Q R S T </div> + + <!-- 4th topmost line --><div>UUUU VVVV WWWW XXXX</div> + + <!-- 5th topmost line --><div>Z a b c d</div> + + <!-- 6th topmost line --><div>e f g h j</div> + + <!-- 7th topmost line --><div id="bottom-border">k m n qqqq rrrr</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-002.xht new file mode 100644 index 00000000000..9a5bdd60bc5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-002.xht @@ -0,0 +1,88 @@ +<!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-rl - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.right-border { border-right: blue solid 1em; } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The right-most line of right-most "S" --> <div class="right-border">A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + + +<!-- The right-most line of left-most "S" --> <div class="right-border">L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + + +<!-- The right-most line of "A" --> <div class="right-border">YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + + +<!-- The right-most line of "P" --> <div class="right-border">eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div id="left-border">kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-003.xht new file mode 100644 index 00000000000..da9c84d8057 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-003.xht @@ -0,0 +1,88 @@ +<!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-lr - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.left-border { border-left: blue solid 1em; } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The 1st left-most line of "P" --> <div class="left-border">AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + + +<!-- The left-most line of "A" --> <div class="left-border">GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + + +<!-- The 1st left-most line of left-most "S" --> <div class="left-border">NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + + +<!-- The left-most line of right-most "S" --> <div class="left-border">aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div id="right-border">j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-004.xht new file mode 100644 index 00000000000..b1c983097a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-004.xht @@ -0,0 +1,53 @@ +<!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: 'writing-mode' - initial value is 'horizontal-tb'</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the default, initial value of writing-mode is 'horizontal-tb'." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + width: 21em; + } + + div + { + background-color: blue; + border-left: blue solid 1em; + border-right: blue solid 1em; + } + + div#top-border { border-top: blue solid 1em; } + + div#bottom-border { border-bottom: blue solid 1em; } + ]]></style> + </head> + + <body> + + <!-- topmost line --><div id="top-border">AAAA BBBB CCCC DDDD</div> + + <!-- 2nd topmost line --><div>E F G H J L </div> + + <!-- 3rd topmost line --><div>M N Q R S T </div> + + <!-- 4th topmost line --><div>UUUU VVVV WWWW XXXX</div> + + <!-- 5th topmost line --><div>Z a b c d</div> + + <!-- 6th topmost line --><div>e f g h j</div> + + <!-- 7th topmost line --><div id="bottom-border">k m n qqqq rrrr</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-005.xht new file mode 100644 index 00000000000..8f1ce1f35b2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-005.xht @@ -0,0 +1,82 @@ +<!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: 'float: left' and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a left-floated box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#floated-left + { + background-color: blue; + border-top: blue solid 1em; + float: left; + height: 8em; + writing-mode: vertical-rl; + } + + div.right-border { border-right: blue solid 1em; } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="floated-left"> + +<!-- The right-most line of right-most "S" --> <div class="right-border">A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + + +<!-- The right-most line of left-most "S" --> <div class="right-border">L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + + +<!-- The right-most line of "A" --> <div class="right-border">YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + + +<!-- The right-most line of "P" --> <div class="right-border">eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div id="left-border">kkkkkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-006.xht new file mode 100644 index 00000000000..787d8ae4699 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-006.xht @@ -0,0 +1,87 @@ +<!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: 'float: left' and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that left-floated boxes with 'writing-mode' set to 'vertical-rl' establish block formating contexts with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.floated-left + { + background-color: blue; + border-bottom: blue solid 1em; + border-left: blue solid 1em; + border-top: blue solid 1em; + float: left; + writing-mode: vertical-rl; + } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div class="floated-left"> + +<!-- The right-most line of "P" --> <div>eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div>kkkkkkk</div> + + </div> + + <div class="floated-left"> + +<!-- The right-most line of "A" --> <div>YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + </div> + + <div class="floated-left"> + +<!-- The right-most line of left-most "S" --> <div>L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + </div> + + <div class="floated-left" id="right-border"> + +<!-- The right-most line of right-most "S" --> <div>A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-007.xht new file mode 100644 index 00000000000..be109f661d7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-007.xht @@ -0,0 +1,82 @@ +<!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: 'float: right' and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a right-floated box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#floated-right + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + float: right; + writing-mode: vertical-lr; + } + + div.left-border { border-left: blue solid 1em; } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="floated-right"> + +<!-- The 1st left-most line of "P" --> <div class="left-border">AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + + +<!-- The left-most line of "A" --> <div class="left-border">GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + + +<!-- The 1st left-most line of left-most "S" --> <div class="left-border">NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + + +<!-- The left-most line of right-most "S" --> <div class="left-border">aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div id="right-border">j kkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-008.xht new file mode 100644 index 00000000000..dc1ede68bf9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-008.xht @@ -0,0 +1,87 @@ +<!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: 'float: right' and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that right-floated boxes with 'writing-mode' set to 'vertical-lr' establish block formating contexts with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.floated-right + { + background-color: blue; + border-bottom: blue solid 1em; + border-right: blue solid 1em; + border-top: blue solid 1em; + float: right; + writing-mode: vertical-lr; + } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div class="floated-right"> + +<!-- The left-most line of right-most "S" --> <div>aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div>j kkkk</div> + + </div> + + <div class="floated-right"> + +<!-- The 1st left-most line of left-most "S" --> <div>NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + </div> + + <div class="floated-right"> + +<!-- The left-most line of "A" --> <div>GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + </div> + + <div class="floated-right" id="left-border"> + +<!-- The 1st left-most line of "P" --> <div>AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-009.xht new file mode 100644 index 00000000000..8891b6eab3f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-009.xht @@ -0,0 +1,88 @@ +<!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: position absolute and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#abs-pos + { + height: 9em; + left: auto; + position: absolute; + writing-mode: vertical-rl; + } + + div#abs-pos > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.right-border { border-right: blue solid 1em; } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="abs-pos"> + +<!-- The right-most line of right-most "S" --> <div class="right-border">A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + + +<!-- The right-most line of left-most "S" --> <div class="right-border">L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + + +<!-- The right-most line of "A" --> <div class="right-border">YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + + +<!-- The right-most line of "P" --> <div class="right-border">eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div id="left-border">kkkkkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-010.xht new file mode 100644 index 00000000000..f70e4eb75b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-010.xht @@ -0,0 +1,88 @@ +<!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: position absolute and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#abs-pos + { + height: 9em; + left: auto; + position: absolute; + writing-mode: vertical-lr; + } + + div#abs-pos > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.left-border { border-left: blue solid 1em; } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="abs-pos"> + +<!-- The 1st left-most line of "P" --> <div class="left-border">AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + + +<!-- The left-most line of "A" --> <div class="left-border">GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + + +<!-- The 1st left-most line of left-most "S" --> <div class="left-border">NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + + +<!-- The left-most line of right-most "S" --> <div class="left-border">aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div id="right-border">j kkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-011.xht new file mode 100644 index 00000000000..55d908434de --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-011.xht @@ -0,0 +1,95 @@ +<!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 and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-rl; + } + + span { display: block; } + + span.right-border { border-right: blue solid 1em; } + + span#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The right-most line of right-most "S" --> <span class="right-border">A BBBB</span> + +<!-- The 2nd right-most line of right-most "S" --> <span>C D E</span> + +<!-- The 3rd right-most line of right-most "S" --> <span>F G H</span> + +<!-- The 4th right-most line of right-most "S" --> <span>JJJJ K</span> + + + +<!-- The right-most line of left-most "S" --> <span class="right-border">L MMMM</span> + +<!-- The 2nd right-most line of left-most "S" --> <span>Q R S</span> + +<!-- The 3rd right-most line of left-most "S" --> <span>T U V</span> + +<!-- The 4th right-most line of left-most "S" --> <span>WWWW X</span> + + + +<!-- The right-most line of "A" --> <span class="right-border">YYYYYYY</span> + +<!-- The 2nd right-most line of "A" --> <span>Z a </span> + +<!-- The 3rd right-most line of "A" --> <span>b c </span> + +<!-- The 4th right-most line of "A" --> <span>ddddddd</span> + + + +<!-- The right-most line of "P" --> <span class="right-border">eeee </span> + +<!-- The 2nd right-most line of "P" --> <span>f g </span> + +<!-- The 3rd right-most line of "P" --> <span>h j </span> + +<!-- The 4th right-most line of "P" --> <span id="left-border">kkkkkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-012.xht new file mode 100644 index 00000000000..3f3daff070d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-012.xht @@ -0,0 +1,67 @@ +<!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 and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-rl; + } + + span + { + border-right: blue solid 1em; + display: block; + } + + span#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The right-most "S" --> <span>A BBBB C D E F G H JJJJ K</span> + +<!-- The left-most "S" --> <span>L MMMM Q R S T U V WWWW X</span> + +<!-- The "A" --> <span>YYYYYYY Z a b c ddddddd</span> + +<!-- The "P" --> <span id="left-border">eeee f g h j kkkkkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-013.xht new file mode 100644 index 00000000000..be88e256136 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-013.xht @@ -0,0 +1,94 @@ +<!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 and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.inline-block + { + background-color: blue; + border-right: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-rl; + } + + span { display: block; } + + span#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div class="inline-block"> + +<!-- The right-most line of "P" --> <span>eeee </span> + +<!-- The 2nd right-most line of "P" --> <span>f g </span> + +<!-- The 3rd right-most line of "P" --> <span>h j </span> + +<!-- The 4th right-most line of "P" --> <span id="left-border">kkkkkkk</span> + + </div><div class="inline-block"> + +<!-- The right-most line of "A" --> <span>YYYYYYY</span> + +<!-- The 2nd right-most line of "A" --> <span>Z a </span> + +<!-- The 3rd right-most line of "A" --> <span>b c </span> + +<!-- The 4th right-most line of "A" --> <span>ddddddd</span> + + </div><div class="inline-block"> + +<!-- The right-most line of left-most "S" --> <span>L MMMM</span> + +<!-- The 2nd right-most line of left-most "S" --> <span>Q R S</span> + +<!-- The 3rd right-most line of left-most "S" --> <span>T U V</span> + +<!-- The 4th right-most line of left-most "S" --> <span>WWWW X</span> + + </div><div class="inline-block"> + +<!-- The right-most line of right-most "S" --> <span>A BBBB</span> + +<!-- The 2nd right-most line of right-most "S" --> <span>C D E</span> + +<!-- The 3rd right-most line of right-most "S" --> <span>F G H</span> + +<!-- The 4th right-most line of right-most "S" --> <span>JJJJ K</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-014.xht new file mode 100644 index 00000000000..eaa957bd573 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-014.xht @@ -0,0 +1,95 @@ +<!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 and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-lr; + } + + span { display: block; } + + span.left-border { border-left: blue solid 1em; } + + span#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The 1st left-most line of "P" --> <span class="left-border">AAAAAAA</span> + +<!-- The 2nd left-most line of "P" --> <span>B C </span> + +<!-- The 3rd left-most line of "P" --> <span>D E </span> + +<!-- The 4th left-most line of "P" --> <span>FFFF </span> + + + +<!-- The left-most line of "A" --> <span class="left-border">GGGGGGG</span> + +<!-- The 2nd left-most line of "A" --> <span>H J </span> + +<!-- The 3rd left-most line of "A" --> <span>K L </span> + +<!-- The 4th left-most line of "A" --> <span>MMMMMMM</span> + + + +<!-- The 1st left-most line of left-most "S" --> <span class="left-border">NNNN Q</span> + +<!-- The 2nd left-most line of left-most "S" --> <span>R S T</span> + +<!-- The 3rd left-most line of left-most "S" --> <span>U V W</span> + +<!-- The 4th left-most line of left-most "S" --> <span>X YYYY</span> + + + +<!-- The left-most line of right-most "S" --> <span class="left-border">aaaa b</span> + +<!-- The 2nd left-most line of right-most "S" --> <span>c d e</span> + +<!-- The 3rd left-most line of right-most "S" --> <span>f g h</span> + +<!-- The 4th left-most line of right-most "S" --> <span id="right-border">j kkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-015.xht new file mode 100644 index 00000000000..d1daa5ea390 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-015.xht @@ -0,0 +1,60 @@ +<!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 and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + writing-mode: vertical-lr; + } + + span + { + border-left: blue solid 1em; + display: block; + } + + span#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The "P" --> <span>AAAAAAA B C D E FFFF </span> + +<!-- The "A" --> <span>GGGGGGG H J K L MMMMMMM</span> + +<!-- The left-most "S" --> <span>NNNN Q R S T U V W X YYYY</span> + +<!-- The right-most "S" --> <span id="right-border">aaaa b c d e f g h j kkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-016.xht new file mode 100644 index 00000000000..c40316dcfc3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-016.xht @@ -0,0 +1,94 @@ +<!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 and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.inline-block + { + background-color: blue; + border-left: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-lr; + } + + span { display: block; } + + span#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div class="inline-block"> + +<!-- The 1st left-most line of "P" --> <span>AAAAAAA</span> + +<!-- The 2nd left-most line of "P" --> <span>B C </span> + +<!-- The 3rd left-most line of "P" --> <span>D E </span> + +<!-- The 4th left-most line of "P" --> <span>FFFF </span> + + </div><div class="inline-block"> + +<!-- The left-most line of "A" --> <span>GGGGGGG</span> + +<!-- The 2nd left-most line of "A" --> <span>H J </span> + +<!-- The 3rd left-most line of "A" --> <span>K L </span> + +<!-- The 4th left-most line of "A" --> <span>MMMMMMM</span> + + </div><div class="inline-block"> + +<!-- The 1st left-most line of left-most "S" --> <span>NNNN Q</span> + +<!-- The 2nd left-most line of left-most "S" --> <span>R S T</span> + +<!-- The 3rd left-most line of left-most "S" --> <span>U V W</span> + +<!-- The 4th left-most line of left-most "S" --> <span>X YYYY</span> + + </div><div class="inline-block"> + +<!-- The left-most line of right-most "S" --> <span>aaaa b</span> + +<!-- The 2nd left-most line of right-most "S" --> <span>c d e</span> + +<!-- The 3rd left-most line of right-most "S" --> <span>f g h</span> + +<!-- The 4th left-most line of right-most "S" --> <span id="right-border">j kkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-017.xht new file mode 100644 index 00000000000..51d87712d61 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-017.xht @@ -0,0 +1,87 @@ +<!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: table-cell and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table-cell with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#table-cell + { + display: table-cell; + height: 9em; + writing-mode: vertical-rl; + } + + div#table-cell > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.right-border { border-right: blue solid 1em; } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="table-cell"> + +<!-- The right-most line of right-most "S" --> <div class="right-border">A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + + +<!-- The right-most line of left-most "S" --> <div class="right-border">L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + + +<!-- The right-most line of "A" --> <div class="right-border">YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + + +<!-- The right-most line of "P" --> <div class="right-border">eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div id="left-border">kkkkkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-018.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-018.xht new file mode 100644 index 00000000000..c9488be4ebf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-018.xht @@ -0,0 +1,87 @@ +<!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: table-cell and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table-cell with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#table-cell + { + display: table-cell; + height: 9em; + writing-mode: vertical-lr; + } + + div#table-cell > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.left-border { border-left: blue solid 1em; } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="table-cell"> + +<!-- The 1st left-most line of "P" --> <div class="left-border">AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + + +<!-- The left-most line of "A" --> <div class="left-border">GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + + +<!-- The 1st left-most line of left-most "S" --> <div class="left-border">NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + + +<!-- The left-most line of right-most "S" --> <div class="left-border">aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div id="right-border">j kkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-019.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-019.xht new file mode 100644 index 00000000000..df022044eeb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-019.xht @@ -0,0 +1,87 @@ +<!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: table-caption and 'vertical-rl' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table-caption with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#table-caption + { + display: table-caption; + height: 9em; + writing-mode: vertical-rl; + } + + div#table-caption > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.right-border { border-right: blue solid 1em; } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="table-caption"> + +<!-- The right-most line of right-most "S" --> <div class="right-border">A BBBB</div> + +<!-- The 2nd right-most line of right-most "S" --> <div>C D E</div> + +<!-- The 3rd right-most line of right-most "S" --> <div>F G H</div> + +<!-- The 4th right-most line of right-most "S" --> <div>JJJJ K</div> + + + +<!-- The right-most line of left-most "S" --> <div class="right-border">L MMMM</div> + +<!-- The 2nd right-most line of left-most "S" --> <div>Q R S</div> + +<!-- The 3rd right-most line of left-most "S" --> <div>T U V</div> + +<!-- The 4th right-most line of left-most "S" --> <div>WWWW X</div> + + + +<!-- The right-most line of "A" --> <div class="right-border">YYYYYYY</div> + +<!-- The 2nd right-most line of "A" --> <div>Z a </div> + +<!-- The 3rd right-most line of "A" --> <div>b c </div> + +<!-- The 4th right-most line of "A" --> <div>ddddddd</div> + + + +<!-- The right-most line of "P" --> <div class="right-border">eeee </div> + +<!-- The 2nd right-most line of "P" --> <div>f g </div> + +<!-- The 3rd right-most line of "P" --> <div>h j </div> + +<!-- The 4th right-most line of "P" --> <div id="left-border">kkkkkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-020.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-020.xht new file mode 100644 index 00000000000..09278a7547c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-020.xht @@ -0,0 +1,87 @@ +<!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: table-caption and 'vertical-lr' - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table-caption with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#table-caption + { + display: table-caption; + height: 9em; + writing-mode: vertical-lr; + } + + div#table-caption > div + { + background-color: blue; + border-bottom: blue solid 1em; + border-top: blue solid 1em; + } + + div.left-border { border-left: blue solid 1em; } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div id="table-caption"> + +<!-- The 1st left-most line of "P" --> <div class="left-border">AAAAAAA</div> + +<!-- The 2nd left-most line of "P" --> <div>B C </div> + +<!-- The 3rd left-most line of "P" --> <div>D E </div> + +<!-- The 4th left-most line of "P" --> <div>FFFF </div> + + + +<!-- The left-most line of "A" --> <div class="left-border">GGGGGGG</div> + +<!-- The 2nd left-most line of "A" --> <div>H J </div> + +<!-- The 3rd left-most line of "A" --> <div>K L </div> + +<!-- The 4th left-most line of "A" --> <div>MMMMMMM</div> + + + +<!-- The 1st left-most line of left-most "S" --> <div class="left-border">NNNN Q</div> + +<!-- The 2nd left-most line of left-most "S" --> <div>R S T</div> + +<!-- The 3rd left-most line of left-most "S" --> <div>U V W</div> + +<!-- The 4th left-most line of left-most "S" --> <div>X YYYY</div> + + + +<!-- The left-most line of right-most "S" --> <div class="left-border">aaaa b</div> + +<!-- The 2nd left-most line of right-most "S" --> <div>c d e</div> + +<!-- The 3rd left-most line of right-most "S" --> <div>f g h</div> + +<!-- The 4th left-most line of right-most "S" --> <div id="right-border">j kkkk</div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-021.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-021.xht new file mode 100644 index 00000000000..25d4d99e1ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-021.xht @@ -0,0 +1,90 @@ +<!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: list and vertical-rl - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one and then the 2nd block is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + ul + { + background-color: blue; + border-bottom: blue solid 1em; + list-style: none outside url("support/blue1x1.png"); + margin: 0em; + padding-top: 1em; /* overriding default padding-start: 40px in several browsers */ + } + + ul.right-border { border-right: blue solid 1em; } + + ul#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The right-most line of right-most "S" --> <ul class="right-border"><li>A BBBB</li></ul> + +<!-- The 2nd right-most line of right-most "S" --> <ul><li>C D E</li></ul> + +<!-- The 3rd right-most line of right-most "S" --> <ul><li>F G H</li></ul> + +<!-- The 4th right-most line of right-most "S" --> <ul><li>JJJJ K</li></ul> + + + +<!-- The right-most line of left-most "S" --> <ul class="right-border"><li>L MMMM</li></ul> + +<!-- The 2nd right-most line of left-most "S" --> <ul><li>Q R S</li></ul> + +<!-- The 3rd right-most line of left-most "S" --> <ul><li>T U V</li></ul> + +<!-- The 4th right-most line of left-most "S" --> <ul><li>WWWW X</li></ul> + + + +<!-- The right-most line of "A" --> <ul class="right-border"><li>YYYYYYY</li></ul> + +<!-- The 2nd right-most line of "A" --> <ul><li>Z a </li></ul> + +<!-- The 3rd right-most line of "A" --> <ul><li>b c </li></ul> + +<!-- The 4th right-most line of "A" --> <ul><li>ddddddd</li></ul> + + + +<!-- The right-most line of "P" --> <ul class="right-border"><li>eeee </li></ul> + +<!-- The 2nd right-most line of "P" --> <ul><li>f g </li></ul> + +<!-- The 3rd right-most line of "P" --> <ul><li>h j </li></ul> + +<!-- The 4th right-most line of "P" --> <ul id="left-border"><li>kkkkkkk</li></ul> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-022.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-022.xht new file mode 100644 index 00000000000..f52553a0286 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-022.xht @@ -0,0 +1,90 @@ +<!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: list and vertical-lr - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and then the 2nd block is juxtaposed to the right-hand side of 1st block, the 3rd block is juxtaposed to the 2nd block on its right-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + ul + { + background-color: blue; + border-bottom: blue solid 1em; + list-style: none outside url("support/blue1x1.png"); + margin: 0em; + padding-top: 1em; /* overriding default 40px in several browsers */ + } + + ul.left-border { border-left: blue solid 1em; } + + ul#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The 1st left-most line of "P" --> <ul class="left-border"><li>AAAAAAA</li></ul> + +<!-- The 2nd left-most line of "P" --> <ul><li>B C </li></ul> + +<!-- The 3rd left-most line of "P" --> <ul><li>D E </li></ul> + +<!-- The 4th left-most line of "P" --> <ul><li>FFFF </li></ul> + + + +<!-- The left-most line of "A" --> <ul class="left-border"><li>GGGGGGG</li></ul> + +<!-- The 2nd left-most line of "A" --> <ul><li>H J </li></ul> + +<!-- The 3rd left-most line of "A" --> <ul><li>K L </li></ul> + +<!-- The 4th left-most line of "A" --> <ul><li>MMMMMMM</li></ul> + + + +<!-- The 1st left-most line of left-most "S" --> <ul class="left-border"><li>NNNN Q</li></ul> + +<!-- The 2nd left-most line of left-most "S" --> <ul><li>R S T</li></ul> + +<!-- The 3rd left-most line of left-most "S" --> <ul><li>U V W</li></ul> + +<!-- The 4th left-most line of left-most "S" --> <ul><li>X YYYY</li></ul> + + + +<!-- The left-most line of right-most "S" --> <ul class="left-border"><li>aaaa b</li></ul> + +<!-- The 2nd left-most line of right-most "S" --> <ul><li>c d e</li></ul> + +<!-- The 3rd left-most line of right-most "S" --> <ul><li>f g h</li></ul> + +<!-- The 4th left-most line of right-most "S" --> <ul id="right-border"><li>j kkkk</li></ul> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-023.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-023.xht new file mode 100644 index 00000000000..822262bb1a6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-023.xht @@ -0,0 +1,60 @@ +<!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-lr - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc... " name="assert" /> + + <!-- + This test is a variation of block-flow-direction-003 test. + --> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + div + { + background-color: blue; + border: blue solid 1em; + border-right: blue none 0em; + } + + div#right-most { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The "P" --> <div>AAAAAAA B C D E FFFF </div> + +<!-- The "A" --> <div>GGGGGGG H J K L MMMMMMM</div> + +<!-- The left-most "S" --> <div>NNNN Q R S T U V W X YYYY</div> + +<!-- The right-most "S" --> <div id="right-most">aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-024.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-024.xht new file mode 100644 index 00000000000..a74d0fb8d37 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-024.xht @@ -0,0 +1,61 @@ +<!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-rl - block flow direction of block-level boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc... " name="assert" /> + + <!-- + This test is a variation of block-flow-direction-002 test. + --> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + /* + " + The principal writing mode of the document is determined by the writing-mode + and direction values specified on the root element. + " + */ + + body + { + color: yellow; + font: 1.25em/1 Ahem; + height: 9em; + } + + div + { + background-color: blue; + border-bottom: blue solid 1em; + border-right: blue solid 1em; + border-top: blue solid 1em; + } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + +<!-- The right-most "S" --> <div>A BBBB C D E F G H JJJJ K</div> + +<!-- The left-most "S" --> <div>L MMMM Q R S T U V WWWW X</div> + +<!-- The "A" --> <div>YYYYYYY Z a b c ddddddd</div> + +<!-- The "P" --> <div id="left-border">eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-025.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-025.xht new file mode 100644 index 00000000000..0a3a75fd525 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-flow-direction-025.xht @@ -0,0 +1,38 @@ +<!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: writing mode of document - horizontal position of first block</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/2011/REC-CSS2-20110607/visuren.html#block-formatting" title="9.4.1 Block formatting contexts" /> + <link rel="match" href="reference/block-flow-direction-025-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that, when 'writing-mode' value of the root element is set to 'vertical-rl', then its block boxes are laid out leftwardedly (from right to left) one after the other beginning at its righthand side." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div + { + background-color: blue; + height: 100px; + width: 100px; + } + ]]></style> + </head> + + <body> + + <div></div> + + <p><img src="support/block-flow-direction-025-exp-res.png" width="359" height="36" alt="Image download support must be enabled" /></p> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-001.xht new file mode 100644 index 00000000000..df28f561e98 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-001.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to a block element, characters are displayed strictly in sequence according to the direction property." name="assert" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> ab > גד > ef ></div> + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-002.xht new file mode 100644 index 00000000000..332a5b7eff6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-002.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to a block element, characters are displayed strictly in sequence according to the direction property." name="assert" /> +<style type="text/css"> +.test { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="test">> ab > גד > ef ></div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> +</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-003.xht new file mode 100644 index 00000000000..36b01c1969c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-003.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-003.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to a block element with no direction value set, characters are displayed strictly in sequence, in ltr order." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test">> ab > גד > ef ></div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-004.xht new file mode 100644 index 00000000000..1e72e0f1614 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-004.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div override inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-004.xht" rel="match" /> +<meta content="If unicode-bidi:bidi-override is applied to a block element, all characters in immediate inline text are displayed strictly in sequence according to the direction property, but content of contained blocks is not." name="assert" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +> ab > גד > ef > +<div>> ab > גד > ef ></div> +> ab > גד > ef > +</div> + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-001.xht new file mode 100644 index 00000000000..fc7cf47fa0f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-001.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-isolate-001.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to a block element, characters are displayed strictly in sequence according to the direction property." name="assert" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="test">> ab > גד > ef ></div> + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-002.xht new file mode 100644 index 00000000000..c1261419187 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-isolate-002.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to a block element, characters are displayed strictly in sequence according to the direction property." name="assert" /> +<style type="text/css"> +.test { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="test">> ab > גד > ef ></div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> +</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-003.xht new file mode 100644 index 00000000000..dad15c36ec4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-003.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-isolate-003.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to a block element with no direction value set, characters are displayed strictly in sequence, in ltr order." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test">> ab > גד > ef ></div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-004.xht new file mode 100644 index 00000000000..130b414b2bd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-override-isolate-004.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div override inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-override-isolate-004.xht" rel="match" /> +<meta content="If unicode-bidi:isolate-override is applied to a block element, all characters in immediate inline text are displayed strictly in sequence according to the direction property, but content of contained blocks is not." name="assert" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +> ab > גד > ef > +<div>> ab > גד > ef ></div> +> ab > גד > ef > +</div> + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-001.xht new file mode 100644 index 00000000000..a099e6bf22f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-001.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-plaintext-001.xht" rel="match" /> +<meta content="If unicode-bidi: plaintext is applied to a div element containing mixed direction text, the order of directional runs in the text in that element will be determined by its first strong character." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> + + + +<div class="test">> א > b > ג ></div> + + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-002.xht new file mode 100644 index 00000000000..e207c2a7e9b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-002.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-plaintext-002.xht" rel="match" /> +<meta content="If unicode-bidi: plaintext is applied to a div element containing mixed direction text, the order of directional runs in the text in that element will be determined by its first strong character." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> + + +<div dir="rtl"> +<div class="test">> a > ב > c ></div> + +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-003.xht new file mode 100644 index 00000000000..fa1d713478e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-003.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-plaintext-003.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to a block element, directional runs are displayed according to the first strong character, but content of contained blocks is not." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +> a > ב > c > +<div>> א > b > ג ></div> +> א > b > ג > +</div> + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="ltr">‭> א > b > ג >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-004.xht new file mode 100644 index 00000000000..296290186d7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-004.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext with br</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<link href="reference/block-plaintext-004.xht" rel="match" /> +<meta content="If unicode-bidi:plaintext is applied to a div element containing br tags, each line of characters that starts after br is displayed according to the first strong character after the br." name="assert" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +> a > ב > c ><br /> +> א > b > ג ><br /> +> a > ב > c ><br /> +</div> + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +<div dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-005.xht new file mode 100644 index 00000000000..b4866da08fc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-005.xht @@ -0,0 +1,55 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: textarea plaintext</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<meta content="If unicode-bidi:plaintext is applied to a textarea element, each line of characters after a linebreak is displayed according to the first strong character after the linebreak." name="assert" /> +<style type="text/css"> +.test textarea { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +textarea { font-family: ezra_silregular, serif; height:5em; width: 100%; border: 0; font-size: 1em; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes display the same glyphs in the same order, with the same line breaks.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +<textarea>> a > ב > c > +> א > b > ג > +> a > ב > c > +</textarea> +</div> + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +<div dir="ltr">‭> a > ב > c >‬</div> +<div> </div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-006.xht new file mode 100644 index 00000000000..8437c27dd97 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/block-plaintext-006.xht @@ -0,0 +1,56 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: pre plaintext</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-direction" rel="help" /> +<meta content="If unicode-bidi:plaintext is applied to a pre element, each line of characters after a linebreak is displayed according to the first strong character after the linebreak." name="assert" /> +<style type="text/css"> +.test pre { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +pre { font-family: ezra_silregular, serif; height:5em; width: 100%; border: 0; font-size: 1em; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes display the same glyphs in the same order, with the same line breaks.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="test"> +<pre>> a > ב > c > +> א > b > ג > +> a > ב > c > +</pre> +</div> + +<div class="ref"> +<div> </div> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +<div dir="ltr">‭> a > ב > c >‬</div> +<div> </div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-003.xht new file mode 100644 index 00000000000..a9129959186 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-003.xht @@ -0,0 +1,133 @@ +<!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: border-spacing - first value is specified and non-zero in 'vertical-lr' table</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/#dimension-mapping" title="7.2 Dimension Mapping" /> + <link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/tables.html#separated-borders" title="17.6.1 The separated borders model" /> + <link rel="match" href="reference/border-spacing-vrl-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that first value of 'border-spacing' represents, from top to bottom, a) spacing between logical table left padding (physical table top padding) and leftmost cells and b) inter-column spacing and c) spacing between rightmost cells and logical table right padding (physical table bottom padding)." name="assert" /> + + <style type="text/css"><![CDATA[ + table + { + border-spacing: 0.5em 0em; /* computes to logical horizontal border-spacing: 10px */ + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + padding: 1.25em 0em; /* computes to padding-top: 25px and padding-bottom: 25px */ + writing-mode: vertical-lr; + } + + td + { + height: 0.5em; + padding: 0em; + width: 1em; + } + + /* + + 0px width of nth row 20px TOP + | | + =================================== 0x (0em) ||| + | table padding-top 25px (1.25em) | ||| + | with red background=color | \ ||| / + | with red background=color | \ / + | with red background=color | \ / + | with red background=color | v + =================================== 25px (1.25em) + |logical left border-spacing: 10px| + | with red background=color | + =================================== 35px (1.75em) + | height of 1st td 10px (0.5em) | ||| + | with red background=color | ||| + =================================== 45px (2.25em) \ ||| / + |inter-column spacing 10px (0.5em)| \ / + | with red background=color | \ / + =================================== 55px (2.75em) v + | height of 2nd td 10px (0.5em) | + | with red background=color | + =================================== 65px (3.25em) + |logical righ border-spacing: 10px| ||| + | with red background=color | ||| + =================================== 75px (3.75em) \ ||| / + |tble padding-bottom 25px (1.25em)| \ / + | with red background=color | \ / + | with red background=color | v + | with red background=color | + | with red background=color | + =================================== 100px (5em) BOTTOM + + */ + + div#reference-overlapping-green + { + background-color: green; + height: 6.25em; + position: absolute; + width: 6.25em; + } + + div#reference-overlapped-red + { + background-color: red; + height: 6.25em; + position: absolute; + width: 6.25em; + z-index: -1; + } + + table#test-overlapped-red + { + background-color: red; + } + + table#test-overlapping-green + { + background-color: green; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div id="reference-overlapping-green"></div> + + <table id="test-overlapped-red"> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + </table> + + <div id="reference-overlapped-red"></div> + + <table id="test-overlapping-green"> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-005.xht new file mode 100644 index 00000000000..6fcd96f6028 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vlr-005.xht @@ -0,0 +1,118 @@ +<!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: border-spacing - second value is specified and non-zero in 'vertical-lr' table</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/#dimension-mapping" title="7.2 Dimension Mapping" /> + <link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/tables.html#separated-borders" title="17.6.1 The separated borders model" /> + <link rel="match" href="reference/border-spacing-vrl-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that second value of 'border-spacing' represents, from left to right, a) spacing between logical table top padding (physical table left padding) and topmost cells and b) inter-row spacing and c) spacing between bottommost cells and logical table bottom padding (physical table right padding)." name="assert" /> + + <style type="text/css"><![CDATA[ + table + { + border-spacing: 0em 0.5em; /* computes to logical vertical border-spacing: 10px */ + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + padding: 0em 1.25em; /* computes to padding-left: 25px and padding-right: 25px */ + writing-mode: vertical-lr; + } + + td + { + height: 1em; + padding: 0em; + width: 0.5em; + } + + /* + + 0px 25px 35px 45px 55px 65px 75px 100px + | padding-left | left | 2nd | middle | 1st | right | padding-right| + | of table | vert. | row | vert. | right | vert. | of table | + | | border | | border | most | border | | + | | spacing| | spacing| row | spacing| | +20| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +40| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +60| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +80| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +00| | | | | | | | +px| | | | | | | | + + */ + + div#reference-overlapping-green + { + background-color: green; + height: 6.25em; + position: absolute; + width: 6.25em; + } + + div#reference-overlapped-red + { + background-color: red; + height: 6.25em; + position: absolute; + width: 6.25em; + z-index: -1; + } + + table#test-overlapped-red + { + background-color: red; + } + + table#test-overlapping-green + { + background-color: green; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div id="reference-overlapping-green"></div> + + <table id="test-overlapped-red"> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + </table> + + <div id="reference-overlapped-red"></div> + + <table id="test-overlapping-green"> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-002.xht new file mode 100644 index 00000000000..9495bf4925b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-002.xht @@ -0,0 +1,133 @@ +<!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: border-spacing - first value is specified and non-zero in 'vertical-rl' table</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/#dimension-mapping" title="7.2 Dimension Mapping" /> + <link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/tables.html#separated-borders" title="17.6.1 The separated borders model" /> + <link rel="match" href="reference/border-spacing-vrl-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that first value of 'border-spacing' represents, from top to bottom, a) spacing between logical table right padding (physical table top padding) and rightmost cells and b) inter-column spacing and c) spacing between leftmost cells and logical table left padding (physical table bottom padding)." name="assert" /> + + <style type="text/css"><![CDATA[ + table + { + border-spacing: 0.5em 0em; /* computes to logical horizontal border-spacing: 10px */ + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + padding: 1.25em 0em; /* computes to padding-top: 25px and padding-bottom: 25px */ + writing-mode: vertical-rl; + } + + td + { + height: 0.5em; + padding: 0em; + width: 1em; + } + + /* + + 0px width of nth row 20px TOP + | | + =================================== 0x (0em) ||| + | table padding-top 25px (1.25em) | ||| + | with red background=color | \ ||| / + | with red background=color | \ / + | with red background=color | \ / + | with red background=color | v + =================================== 25px (1.25em) + |logical righ border-spacing: 10px| + | with red background=color | + =================================== 35px (1.75em) + | height of 1st td 10px (0.5em) | ||| + | with red background=color | ||| + =================================== 45px (2.25em) \ ||| / + |inter-column spacing 10px (0.5em)| \ / + | with red background=color | \ / + =================================== 55px (2.75em) v + | height of 2nd td 10px (0.5em) | + | with red background=color | + =================================== 65px (3.25em) + |logical left border-spacing: 10px| ||| + | with red background=color | ||| + =================================== 75px (3.75em) \ ||| / + |tble padding-bottom 25px (1.25em)| \ / + | with red background=color | \ / + | with red background=color | v + | with red background=color | + | with red background=color | + =================================== 100px (5em) BOTTOM + + */ + + div#reference-overlapping-green + { + background-color: green; + height: 6.25em; + position: absolute; + width: 6.25em; + } + + div#reference-overlapped-red + { + background-color: red; + height: 6.25em; + position: absolute; + width: 6.25em; + z-index: -1; + } + + table#test-overlapped-red + { + background-color: red; + } + + table#test-overlapping-green + { + background-color: green; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div id="reference-overlapping-green"></div> + + <table id="test-overlapped-red"> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + </table> + + <div id="reference-overlapped-red"></div> + + <table id="test-overlapping-green"> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + <tr><td></td><td></td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-004.xht new file mode 100644 index 00000000000..5852e9b6dd3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-spacing-vrl-004.xht @@ -0,0 +1,118 @@ +<!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: border-spacing - second value is specified and non-zero in 'vertical-rl' table</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/#dimension-mapping" title="7.2 Dimension Mapping" /> + <link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/tables.html#separated-borders" title="17.6.1 The separated borders model" /> + <link rel="match" href="reference/border-spacing-vrl-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that second value of 'border-spacing' represents, from right to left, a) spacing between logical table top padding (physical table right padding) and topmost cells and b) inter-row spacing and c) between bottommost cells and logical table bottom padding (physical table left padding)." name="assert" /> + + <style type="text/css"><![CDATA[ + table + { + border-spacing: 0em 0.5em; /* computes to logical vertical border-spacing: 10px */ + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + padding: 0em 1.25em; /* computes to padding-left: 25px and padding-right: 25px */ + writing-mode: vertical-rl; + } + + td + { + height: 1em; + padding: 0em; + width: 0.5em; + } + + /* + + 0px 25px 35px 45px 55px 65px 75px 100px + | padding-left | left | 2nd | middle | 1st | right | padding-right| + | of table | vert. | right | vert. | right | vert. | of table | + | | border | most | border | most | border | | + | | spacing| row | spacing| row | spacing| | +20| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +40| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +60| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +80| | | | | | | | +px| | | | | | | | + | | | | | | | | + | | | | | | | | + | | | | | | | | +00| | | | | | | | +px| | | | | | | | + + */ + + div#reference-overlapping-green + { + background-color: green; + height: 6.25em; + position: absolute; + width: 6.25em; + } + + div#reference-overlapped-red + { + background-color: red; + height: 6.25em; + position: absolute; + width: 6.25em; + z-index: -1; + } + + table#test-overlapped-red + { + background-color: red; + } + + table#test-overlapping-green + { + background-color: green; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div id="reference-overlapping-green"></div> + + <table id="test-overlapped-red"> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + </table> + + <div id="reference-overlapped-red"></div> + + <table id="test-overlapping-green"> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + <tr><td></td><td></td><td></td><td></td><td></td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vlr-007.xht new file mode 100644 index 00000000000..34cf6679f7a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vlr-007.xht @@ -0,0 +1,78 @@ +<!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: border in 'vertical-lr' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that border-left, border-right, border-top and border-bottom do not change in vertical writing-mode. The border-left property of a box still affects the lefthand border of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: blue; + border: transparent none 0px; + height: 9px; + margin: 0px; + } + + .inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise inner blocks must grow as tall as the height of viewport */ + } + + .foo + { + border-bottom: blue solid 5px; + border-left: blue solid 100px; + border-right: blue solid 50px; + border-top: blue solid 20px; + writing-mode: vertical-lr; + } + + .bar + { + border-bottom: blue solid 20px; + border-left: blue solid 50px; + border-right: blue solid 100px; + border-top: blue solid 5px; + writing-mode: vertical-lr; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vrl-006.xht new file mode 100644 index 00000000000..a41f9f029de --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/border-vrl-006.xht @@ -0,0 +1,78 @@ +<!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: border in 'vertical-rl' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that border-left, border-right, border-top and border-bottom do not change in vertical writing-mode. The border-left property of a box still affects the lefthand border of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: blue; + border: transparent none 0px; + height: 9px; + margin: 0px; + } + + .inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise inner blocks must grow as tall as the height of viewport */ + } + + .foo + { + border-bottom: blue solid 5px; + border-left: blue solid 100px; + border-right: blue solid 50px; + border-top: blue solid 20px; + writing-mode: vertical-rl; + } + + .bar + { + border-bottom: blue solid 20px; + border-left: blue solid 50px; + border-right: blue solid 100px; + border-top: blue solid 5px; + writing-mode: vertical-rl; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-003.xht new file mode 100644 index 00000000000..db7ba5d78d6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-003.xht @@ -0,0 +1,67 @@ +<!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: box offsets - position relative</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/abs-pos-non-replaced-vlr-013-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="The 'top', 'right', 'bottom', 'left' property, for relative positioning, specify the offset of the box itself from its normal in-flow position, from the position it would have had if it had been static. The 'top', 'right', 'bottom', 'left' offset property are physical properties, not logical ones in vertical writing-modes." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + img + { + position: relative; + } + + img.moves-toward-left + { + right: 80px; + } + + img.moves-toward-top + { + bottom: 80px; + } + + img.moves-toward-right + { + left: 80px; + } + + img.moves-toward-bottom + { + top: 80px; + } + + /* + In this testcase, 7 red 80px by 80px squares overlap + another red 80px by 80px square (placed in the center of + a 3 by 3 grid of squares) and then, at the end, one single + green 80px by 80px square overlaps all 8 other red squares. + */ + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img class="moves-toward-bottom moves-toward-right" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-right" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-right moves-toward-top" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + <div><img class="moves-toward-bottom" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-top" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + <div><img class="moves-toward-left moves-toward-bottom" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-left" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-left moves-toward-top" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-005.xht new file mode 100644 index 00000000000..45037254380 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vlr-005.xht @@ -0,0 +1,172 @@ +<!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: box offsets - relatively positioned boxes</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/box-offsets-rel-pos-vlr-005-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="Box offsets (bottom, left, right, top) expressed in absolute units (not with percentage unit) for relatively positioned boxes are with respect to the edges of the boxes themselves." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div#statically-positioned-box + { + background-color: yellow; /* padding box will be yellow */ + border: orange solid 50px; /* border box will be orange */ + height: 100px; /* a bright green square 100px by 100px image will serve as content box */ + margin-left: 8px; + padding: 50px; + position: static; + width: 100px; + } + + div.blue-relatively-positioned + { + background-color: blue; + color: white; + height: 25px; + position: relative; + width: 25px; + writing-mode: horizontal-tb; + } + + div#top-left + { + right: 250px; + /* + Calculation of right offset: + 50px (div#statically-positioned-box's border-right) + + + 200px (div#statically-positioned-box's padding-box width) + ================== + 250px + */ + + top: 50px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + ================== + 50px + */ + } + + div#top-right + { + right: 100px; + /* + Calculation of right offset: + 25px (div#top-left's content width) + + + 25px (div#top-right's content width) + + + 50px (div#statically-positioned-box's border-right) + ================== + 100px + */ + + top: 50px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + ================== + 50px + */ + } + + div#bottom-left + { + top: 225px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + + + 200px (div#statically-positioned-box's padding-box height) + - + 25px (div#bottom-left's content height) + ================== + 225px + */ + + right: 300px; + /* + Calculation of right offset: + 25px (div#top-left's content width) + + + 25px (div#top-right's content width) + + + 50px (div#statically-positioned-box's border-right) + + + 200px (div#statically-positioned-box's padding-box width) + ================== + 300px + */ + } + + div#bottom-right + { + top: 225px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + + + 200px (div#statically-positioned-box's padding-box height) + - + 25px (div#bottom-right's content height) + ================== + 225px + */ + + right: 150px; + /* + Calculation of right offset: + 25px (div#top-left's content width) + + + 25px (div#top-right's content width) + + + 25px (div#bottom-left's content width) + + + 25px (div#bottom-right's content width) + + + 50px (div#statically-positioned-box's border-left) + ================== + 150px + */ + } + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-box-offsets-rel-pos.png" width="304" height="35" alt="Image download support must be enabled" /></p> + + <!-- + The image says: + " + Test passes if there is a blue square + at each corner of the yellow square. + " + --> + + <div id="statically-positioned-box"><img src="support/100x100-lime.png" alt="Image download support must be enabled" /></div> + + <div class="blue-relatively-positioned" id="top-left">TL</div> + + <div class="blue-relatively-positioned" id="top-right">TR</div> + + <div class="blue-relatively-positioned" id="bottom-left">BL</div> + + <div class="blue-relatively-positioned" id="bottom-right">BR</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-002.xht new file mode 100644 index 00000000000..92c920f4f7d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-002.xht @@ -0,0 +1,67 @@ +<!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: box offsets - position relative</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/abs-pos-non-replaced-vrl-012-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="The 'top', 'right', 'bottom', 'left' property, for relative positioning, specify the offset of the box itself from its normal in-flow position, from the position it would have had if it had been static. The 'top', 'right', 'bottom', 'left' offset property are physical properties, not logical ones in vertical writing-modes." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + img + { + position: relative; + } + + img.moves-toward-left + { + right: 80px; + } + + img.moves-toward-top + { + bottom: 80px; + } + + img.moves-toward-right + { + left: 80px; + } + + img.moves-toward-bottom + { + top: 80px; + } + + /* + In this testcase, 7 red 80px by 80px squares overlap + another red 80px by 80px square (placed in the center of + a 3 by 3 grid of squares) and then, at the end, one single + green 80px by 80px square overlaps all 8 other red squares. + */ + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img class="moves-toward-bottom moves-toward-left" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-left" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-left moves-toward-top" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + <div><img class="moves-toward-bottom" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-top" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + <div><img class="moves-toward-right moves-toward-bottom" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-right" src="support/100x100-red.png" width="80" height="80" alt="Image download support must be enabled" /><img class="moves-toward-right moves-toward-top" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-004.xht new file mode 100644 index 00000000000..e4246ec2d50 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/box-offsets-rel-pos-vrl-004.xht @@ -0,0 +1,172 @@ +<!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: box offsets - relatively positioned boxes</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/box-offsets-rel-pos-vrl-004-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="Box offsets (bottom, left, right, top) expressed in absolute units (not with percentage unit) for relatively positioned boxes are with respect to the edges of the boxes themselves." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div#statically-positioned-box + { + background-color: yellow; /* padding box will be yellow */ + border: orange solid 50px; /* border box will be orange */ + height: 100px; /* a bright green square 100px by 100px image will serve as content box */ + margin-right: 8px; + padding: 50px; + position: static; + width: 100px; + } + + div.blue-relatively-positioned + { + background-color: blue; + color: white; + height: 25px; + position: relative; + width: 25px; + writing-mode: horizontal-tb; + } + + div#top-left + { + left: 75px; + /* + Calculation of left offset: + 25px (div#top-left's content width) + + + 50px (div#statically-positioned-box's border-left) + ================== + 75px + */ + + top: 50px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + ================== + 50px + */ + } + + div#top-right + { + left: 275px; + /* + Calculation of left offset: + 25px (div#top-left's content width) + + + 50px (div#statically-positioned-box's border-left) + + + 200px (div#statically-positioned-box's padding-box) + ================== + 275px + */ + + top: 50px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + ================== + 50px + */ + } + + div#bottom-left + { + top: 225px; + /* + Calculation of top offset: + 50px (div#statically-positioned-box's border-top) + + + 200px (div#statically-positioned-box's padding-box height) + - + 25px (div#bottom-left's content height) + ================== + 225px + */ + + left: 125px; + /* + Calculation of left offset: + 25px (div#top-left's content width) + + + 25px (div#top-right's content width) + + + 25px (div#bottom-left's content width) + + + 50px (div#statically-positioned-box's border-left) + ================== + 125px + */ + } + + div#bottom-right + { + top: 225px; + /* + Calculation of bottom offset: + 50px (div#statically-positioned-box's border-top) + + + 200px (div#statically-positioned-box's padding-box height) + - + 25px (div#bottom-right's content height) + ================== + 225px + */ + + left: 325px; + /* + Calculation of left offset: + 25px (div#top-left's content width) + + + 25px (div#top-right's content width) + + + 25px (div#bottom-left's content width) + + + 50px (div#statically-positioned-box's border-left) + + + 200px (div#statically-positioned-box's padding-box) + ================== + 325px + */ + } + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-box-offsets-rel-pos.png" width="304" height="35" alt="Image download support must be enabled" /></p> + + <!-- + The image says: + " + Test passes if there is a blue square + at each corner of the yellow square. + " + --> + + <div id="statically-positioned-box"><img src="support/100x100-lime.png" alt="Image download support must be enabled" /></div> + + <div class="blue-relatively-positioned" id="top-left">TL</div> + + <div class="blue-relatively-positioned" id="top-right">TR</div> + + <div class="blue-relatively-positioned" id="bottom-left">BL</div> + + <div class="blue-relatively-positioned" id="bottom-right">BR</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-002.xht new file mode 100644 index 00000000000..9a968beb202 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-002.xht @@ -0,0 +1,46 @@ +<!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: central baseline-alignment of text with 'text-orientation: upright' (vertical-rl)</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/#text-baselines" title="4.2 Text Baselines" /> + <link rel="match" href="reference/central-baseline-alignment-002-ref.xht" /> + + <meta content="This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode." name="assert" /> + <meta content="ahem" name="flags" /> + + <style type="text/css"><![CDATA[ + div#textorient-mixed + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + text-orientation: upright; + writing-mode: vertical-rl; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="textorient-mixed">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-003.xht new file mode 100644 index 00000000000..624faf11233 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/central-baseline-alignment-003.xht @@ -0,0 +1,46 @@ +<!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: central baseline-alignment of text with 'text-orientation: upright' (vertical-lr)</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/#text-baselines" title="4.2 Text Baselines" /> + <link rel="match" href="reference/central-baseline-alignment-002-ref.xht" /> + + <meta content="This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode." name="assert" /> + <meta content="ahem" name="flags" /> + + <style type="text/css"><![CDATA[ + div#textorient-mixed + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + text-orientation: upright; + writing-mode: vertical-lr; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="textorient-mixed">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-1.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-1.xht new file mode 100644 index 00000000000..1b018be9b44 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-1.xht @@ -0,0 +1,75 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Introduction to Writing Modes - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Introduction to Writing Modes (0 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-flow">1 Introduction to Writing Modes</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#block-flow-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#horizontal-block-flow"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#horizontal-writing-mode"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#inline-base-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#vertical-block-flow"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#vertical-writing-mode"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.#writing-mode0"> + <!-- 0 tests --> + </tbody> + <tbody id="s1.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s1.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#placement">1.1 Module Interactions</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s1.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s1.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#values">1.2 Values</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s1.2.#bidi"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-2.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-2.xht new file mode 100644 index 00000000000..a5fc835d18c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-2.xht @@ -0,0 +1,1225 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Inline Direction and Bidirectionality - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Inline Direction and Bidirectionality (101 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-direction">2 Inline Direction and Bidirectionality</a></th></tr> + <!-- 96 tests --> + <tr id="bidi-embed-001-2" class="primary"> + <td><strong> + <a href="bidi-embed-001.xht">bidi-embed-001</a></strong></td> + <td><a href="reference/bidi-embed-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi embed (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-002-2" class="primary"> + <td><strong> + <a href="bidi-embed-002.xht">bidi-embed-002</a></strong></td> + <td><a href="reference/bidi-embed-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi embed (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-003-2" class="primary"> + <td><strong> + <a href="bidi-embed-003.xht">bidi-embed-003</a></strong></td> + <td><a href="reference/bidi-embed-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi embed (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-004-2" class="primary"> + <td><strong> + <a href="bidi-embed-004.xht">bidi-embed-004</a></strong></td> + <td><a href="reference/bidi-embed-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi embed (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:embed are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-005-2" class="primary"> + <td><strong> + <a href="bidi-embed-005.xht">bidi-embed-005</a></strong></td> + <td><a href="reference/bidi-embed-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi embed, rtl + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, that element will interact with the surrounding text like a strongly directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-006-2" class="primary"> + <td><strong> + <a href="bidi-embed-006.xht">bidi-embed-006</a></strong></td> + <td><a href="reference/bidi-embed-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi embed, ltr + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, that element will interact with the surrounding text like a strongly directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-007-2" class="primary"> + <td><strong> + <a href="bidi-embed-007.xht">bidi-embed-007</a></strong></td> + <td><a href="reference/bidi-embed-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl + number + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-008-2" class="primary"> + <td><strong> + <a href="bidi-embed-008.xht">bidi-embed-008</a></strong></td> + <td><a href="reference/bidi-embed-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr + number + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-009-2" class="primary"> + <td><strong> + <a href="bidi-embed-009.xht">bidi-embed-009</a></strong></td> + <td><a href="reference/bidi-embed-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl list + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-010-2" class="primary"> + <td><strong> + <a href="bidi-embed-010.xht">bidi-embed-010</a></strong></td> + <td><a href="reference/bidi-embed-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr list + <ul class="assert"> + <li>If unicode-bidi:embed is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-embed-011-2" class="primary"> + <td><strong> + <a href="bidi-embed-011.xht">bidi-embed-011</a></strong></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: direction alone and inherited, unicode-bidi embed + <ul class="assert"> + <li>Directionality is not changed by the direction property on its own, but unicode-bidi: embed will apply direction declared on a higher level element.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-001-2" class="primary"> + <td><strong> + <a href="bidi-isolate-001.xht">bidi-isolate-001</a></strong></td> + <td><a href="reference/bidi-isolate-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-002-2" class="primary"> + <td><strong> + <a href="bidi-isolate-002.xht">bidi-isolate-002</a></strong></td> + <td><a href="reference/bidi-isolate-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-003-2" class="primary"> + <td><strong> + <a href="bidi-isolate-003.xht">bidi-isolate-003</a></strong></td> + <td><a href="reference/bidi-isolate-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-004-2" class="primary"> + <td><strong> + <a href="bidi-isolate-004.xht">bidi-isolate-004</a></strong></td> + <td><a href="reference/bidi-isolate-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:isolate are applied to an inline element containing mixed direction text, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-005-2" class="primary"> + <td><strong> + <a href="bidi-isolate-005.xht">bidi-isolate-005</a></strong></td> + <td><a href="reference/bidi-isolate-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi isolate, rtl + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-006-2" class="primary"> + <td><strong> + <a href="bidi-isolate-006.xht">bidi-isolate-006</a></strong></td> + <td><a href="reference/bidi-isolate-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi isolate, ltr + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-007-2" class="primary"> + <td><strong> + <a href="bidi-isolate-007.xht">bidi-isolate-007</a></strong></td> + <td><a href="reference/bidi-isolate-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl + number + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-008-2" class="primary"> + <td><strong> + <a href="bidi-isolate-008.xht">bidi-isolate-008</a></strong></td> + <td><a href="reference/bidi-isolate-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr + number + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-009-2" class="primary"> + <td><strong> + <a href="bidi-isolate-009.xht">bidi-isolate-009</a></strong></td> + <td><a href="reference/bidi-isolate-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl list + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, the text in that element WILL be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-010-2" class="primary"> + <td><strong> + <a href="bidi-isolate-010.xht">bidi-isolate-010</a></strong></td> + <td><a href="reference/bidi-isolate-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr list + <ul class="assert"> + <li>If unicode-bidi:isolate is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-011-2" class="primary"> + <td><strong> + <a href="bidi-isolate-011.xht">bidi-isolate-011</a></strong></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: direction alone and inherited, unicode-bidi embed + <ul class="assert"> + <li>Directionality is not changed by the direction property on its own, but unicode-bidi: isolate will apply direction declared on a higher level element.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-001-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-001.xht">bidi-isolate-override-001</a></strong></td> + <td><a href="reference/bidi-isolate-override-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, isolate-override (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-002-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-002.xht">bidi-isolate-override-002</a></strong></td> + <td><a href="reference/bidi-isolate-override-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, isolate-override (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-003-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-003.xht">bidi-isolate-override-003</a></strong></td> + <td><a href="reference/bidi-isolate-override-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, isolate-override (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-004-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-004.xht">bidi-isolate-override-004</a></strong></td> + <td><a href="reference/bidi-isolate-override-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, isolate-override (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:isolate-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-005-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-005.xht">bidi-isolate-override-005</a></strong></td> + <td><a href="reference/bidi-isolate-override-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with isolate-override, rtl + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-006-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-006.xht">bidi-isolate-override-006</a></strong></td> + <td><a href="reference/bidi-isolate-override-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with isolate-override, ltr + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-007-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-007.xht">bidi-isolate-override-007</a></strong></td> + <td><a href="reference/bidi-isolate-override-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and isolate-override, rtl + number + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-008-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-008.xht">bidi-isolate-override-008</a></strong></td> + <td><a href="reference/bidi-isolate-override-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and isolate-override, ltr + number + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-009-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-009.xht">bidi-isolate-override-009</a></strong></td> + <td><a href="reference/bidi-isolate-override-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and isolate-override, rtl list + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-010-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-010.xht">bidi-isolate-override-010</a></strong></td> + <td><a href="reference/bidi-isolate-override-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and isolate-override, ltr list + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to an inline element, the text in that element WILL be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-011-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-011.xht">bidi-isolate-override-011</a></strong></td> + <td><a href="reference/bidi-isolate-override-011.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: direction alone and inherited, isolate-override + <ul class="assert"> + <li>unicode-bidi: isolate-override will apply direction declared on a higher level element.</li> + </ul> + </td> + </tr> + <tr id="bidi-isolate-override-012-2" class="primary"> + <td><strong> + <a href="bidi-isolate-override-012.xht">bidi-isolate-override-012</a></strong></td> + <td><a href="reference/bidi-isolate-override-012.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: default direction, isolate-override + <ul class="assert"> + <li>unicode-bidi: When no direction is set, isolate-override will apply ltr ordering to text within its scope.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-001-2" class="primary"> + <td><strong> + <a href="bidi-normal-001.xht">bidi-normal-001</a></strong></td> + <td><a href="reference/bidi-normal-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi normal (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-002-2" class="primary"> + <td><strong> + <a href="bidi-normal-002.xht">bidi-normal-002</a></strong></td> + <td><a href="reference/bidi-normal-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi normal (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-003-2" class="primary"> + <td><strong> + <a href="bidi-normal-003.xht">bidi-normal-003</a></strong></td> + <td><a href="reference/bidi-normal-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi normal (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-004-2" class="primary"> + <td><strong> + <a href="bidi-normal-004.xht">bidi-normal-004</a></strong></td> + <td><a href="reference/bidi-normal-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi normal (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:normal are applied to an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-005-2" class="primary"> + <td><strong> + <a href="bidi-normal-005.xht">bidi-normal-005</a></strong></td> + <td><a href="reference/bidi-normal-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi normal, rtl + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-006-2" class="primary"> + <td><strong> + <a href="bidi-normal-006.xht">bidi-normal-006</a></strong></td> + <td><a href="reference/bidi-normal-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi normal, ltr + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-007-2" class="primary"> + <td><strong> + <a href="bidi-normal-007.xht">bidi-normal-007</a></strong></td> + <td><a href="reference/bidi-normal-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl + number + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-008-2" class="primary"> + <td><strong> + <a href="bidi-normal-008.xht">bidi-normal-008</a></strong></td> + <td><a href="reference/bidi-normal-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr + number + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-009-2" class="primary"> + <td><strong> + <a href="bidi-normal-009.xht">bidi-normal-009</a></strong></td> + <td><a href="reference/bidi-normal-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl list + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-010-2" class="primary"> + <td><strong> + <a href="bidi-normal-010.xht">bidi-normal-010</a></strong></td> + <td><a href="reference/bidi-normal-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr list + <ul class="assert"> + <li>If unicode-bidi:normal is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-normal-011-2" class="primary"> + <td><strong> + <a href="bidi-normal-011.xht">bidi-normal-011</a></strong></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: direction alone and inherited, unicode-bidi normal + <ul class="assert"> + <li>Directionality is not changed by the direction property on its own, nor by unicode-bidi:normal set on a lower level element.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-001-2" class="primary"> + <td><strong> + <a href="bidi-override-001.xht">bidi-override-001</a></strong></td> + <td><a href="reference/bidi-override-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, bidi-override (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-002-2" class="primary"> + <td><strong> + <a href="bidi-override-002.xht">bidi-override-002</a></strong></td> + <td><a href="reference/bidi-override-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, bidi-override (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in rtl order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-003-2" class="primary"> + <td><strong> + <a href="bidi-override-003.xht">bidi-override-003</a></strong></td> + <td><a href="reference/bidi-override-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, bidi-override (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-004-2" class="primary"> + <td><strong> + <a href="bidi-override-004.xht">bidi-override-004</a></strong></td> + <td><a href="reference/bidi-override-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, bidi-override (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr and unicode-bidi:bidi-override are applied to an inline element containing mixed direction text, the characters in that element will all be displayed in ltr order, ignoring the bidi algorithm.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-005-2" class="primary"> + <td><strong> + <a href="bidi-override-005.xht">bidi-override-005</a></strong></td> + <td><a href="reference/bidi-override-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with bidi-override, rtl + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, that element will interact with the surrounding text like a strongly directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-006-2" class="primary"> + <td><strong> + <a href="bidi-override-006.xht">bidi-override-006</a></strong></td> + <td><a href="reference/bidi-override-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with bidi-override, ltr + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, that element will interact with the surrounding text like a strongly directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-007-2" class="primary"> + <td><strong> + <a href="bidi-override-007.xht">bidi-override-007</a></strong></td> + <td><a href="reference/bidi-override-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and bidi-override, rtl + number + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-008-2" class="primary"> + <td><strong> + <a href="bidi-override-008.xht">bidi-override-008</a></strong></td> + <td><a href="reference/bidi-override-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and bidi-override, ltr + number + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-009-2" class="primary"> + <td><strong> + <a href="bidi-override-009.xht">bidi-override-009</a></strong></td> + <td><a href="reference/bidi-override-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and bidi-override, rtl list + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-010-2" class="primary"> + <td><strong> + <a href="bidi-override-010.xht">bidi-override-010</a></strong></td> + <td><a href="reference/bidi-override-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and bidi-override, ltr list + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-011-2" class="primary"> + <td><strong> + <a href="bidi-override-011.xht">bidi-override-011</a></strong></td> + <td><a href="reference/bidi-override-011.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: direction alone and inherited, bidi-override + <ul class="assert"> + <li>unicode-bidi: bidi-override will apply direction declared on a higher level element.</li> + </ul> + </td> + </tr> + <tr id="bidi-override-012-2" class="primary"> + <td><strong> + <a href="bidi-override-012.xht">bidi-override-012</a></strong></td> + <td><a href="reference/bidi-override-012.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: default direction, bidi-override + <ul class="assert"> + <li>unicode-bidi: When no direction is set, bidi-override will apply ltr ordering to text within its scope.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-001-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-001.xht">bidi-plaintext-001</a></strong></td> + <td><a href="reference/bidi-plaintext-001.xht">=</a> </td> + <td></td> + <td>unicode-bidi: span unicode-bidi plaintext, rtl (1) + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is rtl, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-002-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-002.xht">bidi-plaintext-002</a></strong></td> + <td><a href="reference/bidi-plaintext-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span unicode-bidi plaintext, rtl (2) + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is rtl, the text in that element will be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-003-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-003.xht">bidi-plaintext-003</a></strong></td> + <td><a href="reference/bidi-plaintext-003.xht">=</a> </td> + <td></td> + <td>unicode-bidi: span unicode-bidi plaintext, ltr (1) + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is ltr, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-004-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-004.xht">bidi-plaintext-004</a></strong></td> + <td><a href="reference/bidi-plaintext-004.xht">=</a> </td> + <td></td> + <td>unicode-bidi: span unicode-bidi plaintext, ltr (2) + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with a first strong directional character that is ltr, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-005-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-005.xht">bidi-plaintext-005</a></strong></td> + <td><a href="reference/bidi-plaintext-005.xht">=</a> </td> + <td></td> + <td>unicode-bidi: element as directional character with unicode-bidi plaintext, rtl + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-006-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-006.xht">bidi-plaintext-006</a></strong></td> + <td><a href="reference/bidi-plaintext-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi plaintext, ltr + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, that element will interact with the surrounding text like a neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-007-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-007.xht">bidi-plaintext-007</a></strong></td> + <td><a href="reference/bidi-plaintext-007.xht">=</a> </td> + <td></td> + <td>unicode-bidi: element isolation and unicode-bidi plaintext, rtl + number + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-008-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-008.xht">bidi-plaintext-008</a></strong></td> + <td><a href="reference/bidi-plaintext-008.xht">=</a> </td> + <td></td> + <td>unicode-bidi: element isolation and unicode-bidi plaintext, ltr + number + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-009-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-009.xht">bidi-plaintext-009</a></strong></td> + <td><a href="reference/bidi-plaintext-009.xht">=</a> </td> + <td></td> + <td>unicode-bidi: element isolation and unicode-bidi plaintext, rtl list + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-010-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-010.xht">bidi-plaintext-010</a></strong></td> + <td><a href="reference/bidi-plaintext-010.xht">=</a> </td> + <td></td> + <td>unicode-bidi: element isolation and unicode-bidi plaintext, ltr list + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element, the text in that element WILL be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-plaintext-011-2" class="primary"> + <td><strong> + <a href="bidi-plaintext-011.xht">bidi-plaintext-011</a></strong></td> + <td><a href="reference/bidi-plaintext-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span unicode-bidi plaintext, no strong (1) + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to an inline element containing mixed direction text with no strong directional character, the text in that element will be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-table-001-2" class="primary"> + <td><strong> + <a href="bidi-table-001.xht">bidi-table-001</a></strong></td> + <td></td> + <td></td> + <td>direction: table columns + <ul class="assert"> + <li>If direction is applied to the ancestor of a table element, columns will be displayed in that direction.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-001-2" class="primary"> + <td><strong> + <a href="bidi-unset-001.xht">bidi-unset-001</a></strong></td> + <td><a href="reference/bidi-normal-001.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi unset (1) + <ul class="assert"> + <li>In a ltr context, if direction:rtl is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-002-2" class="primary"> + <td><strong> + <a href="bidi-unset-002.xht">bidi-unset-002</a></strong></td> + <td><a href="reference/bidi-normal-002.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction rtl, unicode-bidi unset (2) + <ul class="assert"> + <li>In a ltr context, if direction:rtl is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in rtl order.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-003-2" class="primary"> + <td><strong> + <a href="bidi-unset-003.xht">bidi-unset-003</a></strong></td> + <td><a href="reference/bidi-normal-003.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi unset (1) + <ul class="assert"> + <li>In a rtl context, if direction:ltr is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-004-2" class="primary"> + <td><strong> + <a href="bidi-unset-004.xht">bidi-unset-004</a></strong></td> + <td><a href="reference/bidi-normal-004.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: span direction ltr, unicode-bidi unset (2) + <ul class="assert"> + <li>In a rtl context, if direction:ltr is set but unicode-bidi is not set on an inline element containing mixed direction text, the text in that element will NOT be displayed in ltr order.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-005-2" class="primary"> + <td><strong> + <a href="bidi-unset-005.xht">bidi-unset-005</a></strong></td> + <td><a href="reference/bidi-normal-005.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi unset, rtl + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-006-2" class="primary"> + <td><strong> + <a href="bidi-unset-006.xht">bidi-unset-006</a></strong></td> + <td><a href="reference/bidi-normal-006.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element as directional character with unicode-bidi unset, ltr + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, that element will NOT interact with the surrounding text like a strong or neutral directional character.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-007-2" class="primary"> + <td><strong> + <a href="bidi-unset-007.xht">bidi-unset-007</a></strong></td> + <td><a href="reference/bidi-normal-007.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi unset, rtl + number + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-008-2" class="primary"> + <td><strong> + <a href="bidi-unset-008.xht">bidi-unset-008</a></strong></td> + <td><a href="reference/bidi-normal-008.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi unset, ltr + number + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from surrounding text.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-009-2" class="primary"> + <td><strong> + <a href="bidi-unset-009.xht">bidi-unset-009</a></strong></td> + <td><a href="reference/bidi-normal-009.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi unset, rtl list + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="bidi-unset-010-2" class="primary"> + <td><strong> + <a href="bidi-unset-010.xht">bidi-unset-010</a></strong></td> + <td><a href="reference/bidi-normal-010.xht">=</a> </td> + <td></td> + <td>direction/unicode-bidi: element isolation and unicode-bidi unset, ltr list + <ul class="assert"> + <li>If direction is set but unicode-bidi is not set on an inline element, the text in that element will NOT be directionally isolated from following content.</li> + </ul> + </td> + </tr> + <tr id="block-embed-001-2" class="primary"> + <td><strong> + <a href="block-embed-001.xht">block-embed-001</a></strong></td> + <td><a href="reference/block-embed-001.xht">=</a> </td> + <td></td> + <td>direction: div direction rtl + <ul class="assert"> + <li>If direction is applied to a block element containing mixed direction text, the text in that element will be displayed in the expected order.</li> + </ul> + </td> + </tr> + <tr id="block-embed-002-2" class="primary"> + <td><strong> + <a href="block-embed-002.xht">block-embed-002</a></strong></td> + <td><a href="reference/block-embed-002.xht">=</a> </td> + <td></td> + <td>direction: div direction ltr + <ul class="assert"> + <li>If direction is applied to a block element containing mixed direction text, the text in that element will be displayed in the expected order.</li> + </ul> + </td> + </tr> + <tr id="block-embed-003-2" class="primary"> + <td><strong> + <a href="block-embed-003.xht">block-embed-003</a></strong></td> + <td><a href="reference/block-embed-003.xht">=</a> </td> + <td></td> + <td>direction: div direction rtl + <ul class="assert"> + <li>If direction is applied to a block element, contained block elements inherit that direction.</li> + </ul> + </td> + </tr> + <tr id="block-override-001-2" class="primary"> + <td><strong> + <a href="block-override-001.xht">block-override-001</a></strong></td> + <td><a href="reference/block-override-001.xht">=</a> </td> + <td></td> + <td>direction: div override rtl + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to a block element, characters are displayed strictly in sequence according to the direction property.</li> + </ul> + </td> + </tr> + <tr id="block-override-002-2" class="primary"> + <td><strong> + <a href="block-override-002.xht">block-override-002</a></strong></td> + <td><a href="reference/block-override-002.xht">=</a> </td> + <td></td> + <td>direction: div override ltr + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to a block element, characters are displayed strictly in sequence according to the direction property.</li> + </ul> + </td> + </tr> + <tr id="block-override-003-2" class="primary"> + <td><strong> + <a href="block-override-003.xht">block-override-003</a></strong></td> + <td><a href="reference/block-override-003.xht">=</a> </td> + <td></td> + <td>direction: div direction ltr + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to a block element with no direction value set, characters are displayed strictly in sequence, in ltr order.</li> + </ul> + </td> + </tr> + <tr id="block-override-004-2" class="primary"> + <td><strong> + <a href="block-override-004.xht">block-override-004</a></strong></td> + <td><a href="reference/block-override-004.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div override inheritance + <ul class="assert"> + <li>If unicode-bidi:bidi-override is applied to a block element, all characters in immediate inline text are displayed strictly in sequence according to the direction property, but content of contained blocks is not.</li> + </ul> + </td> + </tr> + <tr id="block-override-isolate-001-2" class="primary"> + <td><strong> + <a href="block-override-isolate-001.xht">block-override-isolate-001</a></strong></td> + <td><a href="reference/block-override-isolate-001.xht">=</a> </td> + <td></td> + <td>direction: div override rtl + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to a block element, characters are displayed strictly in sequence according to the direction property.</li> + </ul> + </td> + </tr> + <tr id="block-override-isolate-002-2" class="primary"> + <td><strong> + <a href="block-override-isolate-002.xht">block-override-isolate-002</a></strong></td> + <td><a href="reference/block-override-isolate-002.xht">=</a> </td> + <td></td> + <td>direction: div override ltr + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to a block element, characters are displayed strictly in sequence according to the direction property.</li> + </ul> + </td> + </tr> + <tr id="block-override-isolate-003-2" class="primary"> + <td><strong> + <a href="block-override-isolate-003.xht">block-override-isolate-003</a></strong></td> + <td><a href="reference/block-override-isolate-003.xht">=</a> </td> + <td></td> + <td>direction: div direction ltr + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to a block element with no direction value set, characters are displayed strictly in sequence, in ltr order.</li> + </ul> + </td> + </tr> + <tr id="block-override-isolate-004-2" class="primary"> + <td><strong> + <a href="block-override-isolate-004.xht">block-override-isolate-004</a></strong></td> + <td><a href="reference/block-override-isolate-004.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div override inheritance + <ul class="assert"> + <li>If unicode-bidi:isolate-override is applied to a block element, all characters in immediate inline text are displayed strictly in sequence according to the direction property, but content of contained blocks is not.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-001-2" class="primary"> + <td><strong> + <a href="block-plaintext-001.xht">block-plaintext-001</a></strong></td> + <td><a href="reference/block-plaintext-001.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div plaintext, rtl + <ul class="assert"> + <li>If unicode-bidi: plaintext is applied to a div element containing mixed direction text, the order of directional runs in the text in that element will be determined by its first strong character.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-002-2" class="primary"> + <td><strong> + <a href="block-plaintext-002.xht">block-plaintext-002</a></strong></td> + <td><a href="reference/block-plaintext-002.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div plaintext, ltr + <ul class="assert"> + <li>If unicode-bidi: plaintext is applied to a div element containing mixed direction text, the order of directional runs in the text in that element will be determined by its first strong character.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-003-2" class="primary"> + <td><strong> + <a href="block-plaintext-003.xht">block-plaintext-003</a></strong></td> + <td><a href="reference/block-plaintext-003.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div plaintext inheritance + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to a block element, directional runs are displayed according to the first strong character, but content of contained blocks is not.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-004-2" class="primary"> + <td><strong> + <a href="block-plaintext-004.xht">block-plaintext-004</a></strong></td> + <td><a href="reference/block-plaintext-004.xht">=</a> </td> + <td></td> + <td>unicode-bidi: div plaintext with br + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to a div element containing br tags, each line of characters that starts after br is displayed according to the first strong character after the br.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-005-2" class="primary"> + <td><strong> + <a href="block-plaintext-005.xht">block-plaintext-005</a></strong></td> + <td></td> + <td></td> + <td>unicode-bidi: textarea plaintext + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to a textarea element, each line of characters after a linebreak is displayed according to the first strong character after the linebreak.</li> + </ul> + </td> + </tr> + <tr id="block-plaintext-006-2" class="primary"> + <td><strong> + <a href="block-plaintext-006.xht">block-plaintext-006</a></strong></td> + <td></td> + <td></td> + <td>unicode-bidi: pre plaintext + <ul class="assert"> + <li>If unicode-bidi:plaintext is applied to a pre element, each line of characters after a linebreak is displayed according to the first strong character after the linebreak.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s2.#bidi-paragraph"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.#bidirectionality"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.#forced-paragraph-break"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s2.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#direction">2.1 Specifying Directionality: the direction property</a></th></tr> + <!-- 5 tests --> + <tr id="extract-ordered-list-direction-and-writing-modes-2.1" class=""> + <td> + <a href="extract-ordered-list-direction-and-writing-modes.xht">extract-ordered-list-direction-and-writing-modes</a></td> + <td><a href="reference/extract-ordered-list-direction-and-writing-modes-ref.xht">=</a> </td> + <td></td> + <td>flow-into on list items that use different text directions or writing modes + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-002-2.1" class="primary ahem"> + <td><strong> + <a href="table-column-order-002.xht">table-column-order-002</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-rl + <ul class="assert"> + <li>This test checks that a table with 'writing-mode' set to 'vertical-rl' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-003-2.1" class="primary ahem"> + <td><strong> + <a href="table-column-order-003.xht">table-column-order-003</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-lr + <ul class="assert"> + <li>This test checks that a table with 'writing-mode' set to 'vertical-lr' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-004-2.1" class="primary ahem"> + <td><strong> + <a href="table-column-order-004.xht">table-column-order-004</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-rl + <ul class="assert"> + <li>This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-005-2.1" class="primary ahem"> + <td><strong> + <a href="table-column-order-005.xht">table-column-order-005</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-lr + <ul class="assert"> + <li>This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s2.1.#propdef-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.1.#valuedef-ltr"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.1.#valuedef-rtl"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s2.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#unicode-bidi">2.2 Embeddings and Overrides: the unicode-bidi property</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#bidi-isolate"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#directional-embedding"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#directional-override"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#isolated-sequence"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#propdef-unicode-bidi"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-bidi-override"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-embed"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-isolate"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-isolate-override"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-normal"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.2.#valuedef-plaintext"> + <!-- 0 tests --> + </tbody> + <tbody id="s2.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s2.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#bidi-example">2.3 Example of Bidirectional Text</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s2.4"> + <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> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-3.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-3.xht new file mode 100644 index 00000000000..71cf2346faa --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-3.xht @@ -0,0 +1,899 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Introduction to Vertical Text - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Introduction to Vertical Text (76 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#vertical-intro">3 Introduction to Vertical Text</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s3.#fig-mac"> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s3.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode">3.1 Block Flow Direction: the writing-mode property</a></th></tr> + <!-- 65 tests --> + <tr id="block-flow-direction-001-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-001.xht">block-flow-direction-001</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>horizontal-tb - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of a containing block; they are ordered from top to bottom meaning that the 1st block box is the topmost one, then the 2nd block is juxtaposed at its bottom, then the 3rd block is juxtaposed to the 2nd block at its bottom, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-002-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-002.xht">block-flow-direction-002</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-003-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-003.xht">block-flow-direction-003</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-004-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-004.xht">block-flow-direction-004</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'writing-mode' - initial value is 'horizontal-tb' + <ul class="assert"> + <li>This test checks that the default, initial value of writing-mode is 'horizontal-tb'.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-005-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-005.xht">block-flow-direction-005</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: left' and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a left-floated box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-006-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-006.xht">block-flow-direction-006</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: left' and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that left-floated boxes with 'writing-mode' set to 'vertical-rl' establish block formating contexts with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-007-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-007.xht">block-flow-direction-007</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: right' and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a right-floated box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-008-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-008.xht">block-flow-direction-008</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: right' and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that right-floated boxes with 'writing-mode' set to 'vertical-lr' establish block formating contexts with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-009-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-009.xht">block-flow-direction-009</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>position absolute and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-010-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-010.xht">block-flow-direction-010</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>position absolute and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-011-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-011.xht">block-flow-direction-011</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-012-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-012.xht">block-flow-direction-012</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-013-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-013.xht">block-flow-direction-013</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-014-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-014.xht">block-flow-direction-014</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-015-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-015.xht">block-flow-direction-015</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-016-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-016.xht">block-flow-direction-016</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-017-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-017.xht">block-flow-direction-017</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-cell and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a table-cell with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-018-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-018.xht">block-flow-direction-018</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-cell and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a table-cell with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-019-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-019.xht">block-flow-direction-019</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-caption and 'vertical-rl' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a table-caption with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-020-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-020.xht">block-flow-direction-020</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-caption and 'vertical-lr' - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that a table-caption with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-021-3.1" class="primary ahem image"> + <td><strong> + <a href="block-flow-direction-021.xht">block-flow-direction-021</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>list and vertical-rl - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one and then the 2nd block is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-022-3.1" class="primary ahem image"> + <td><strong> + <a href="block-flow-direction-022.xht">block-flow-direction-022</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>list and vertical-lr - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and then the 2nd block is juxtaposed to the right-hand side of 1st block, the 3rd block is juxtaposed to the 2nd block on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-023-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-023.xht">block-flow-direction-023</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-024-3.1" class="primary ahem"> + <td><strong> + <a href="block-flow-direction-024.xht">block-flow-direction-024</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - block flow direction of block-level boxes + <ul class="assert"> + <li>This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="block-flow-direction-025-3.1" class="primary image"> + <td><strong> + <a href="block-flow-direction-025.xht">block-flow-direction-025</a></strong></td> + <td><a href="reference/block-flow-direction-025-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>writing mode of document - horizontal position of first block + <ul class="assert"> + <li>This test checks that, when 'writing-mode' value of the root element is set to 'vertical-rl', then its block boxes are laid out leftwardedly (from right to left) one after the other beginning at its righthand side.</li> + </ul> + </td> + </tr> + <tr id="different-block-flow-dir-001-3.1" class="primary"> + <td><strong> + <a href="different-block-flow-dir-001.xht">different-block-flow-dir-001</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td></td> + <td>descendant inline with a different 'writing-mode' value + <ul class="assert"> + <li>This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.</li> + </ul> + </td> + </tr> + <tr id="different-block-flow-dir-002-3.1" class="primary"> + <td><strong> + <a href="different-block-flow-dir-002.xht">different-block-flow-dir-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td></td> + <td>descendant inline with a different 'writing-mode' value + <ul class="assert"> + <li>This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.</li> + </ul> + </td> + </tr> + <tr id="form-controls-vert-rl-004-3.1" class="primary image should"> + <td><strong> + <a href="form-controls-vert-rl-004.xht">form-controls-vert-rl-004</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td> + <td>order, orientation and layout of form controls in 'vertical-rl' writing-mode + <ul class="assert"> + <li>This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1.</li> + </ul> + </td> + </tr> + <tr id="form-controls-vert-rl-005-3.1" class="primary should"> + <td><strong> + <a href="form-controls-vert-rl-005.xht">form-controls-vert-rl-005</a></strong></td> + <td></td> + <td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td> + <td>form controls in 'vertical-rl' writing-mode + <ul class="assert"> + <li>This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'vertical-rl' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90&deg; clockwise and c) the block flow direction must be from right to left.</li> + </ul> + </td> + </tr> + <tr id="inline-replaced-vlr-003-3.1" class="primary image"> + <td><strong> + <a href="inline-replaced-vlr-003.xht">inline-replaced-vlr-003</a></strong></td> + <td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline replaced element and 'vertical-lr' + <ul class="assert"> + <li>This test checks that the content of an inline replaced element does not rotate due to the writing mode.</li> + </ul> + </td> + </tr> + <tr id="inline-replaced-vrl-002-3.1" class="primary image"> + <td><strong> + <a href="inline-replaced-vrl-002.xht">inline-replaced-vrl-002</a></strong></td> + <td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline replaced element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the content of an inline replaced element does not rotate due to the writing mode.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-001-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-001.xht">line-box-direction-001</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>horizontal-tb - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes of a block box in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of the block box; they are ordered from top to bottom meaning that the 1st line box is the topmost one and then the 2nd block is juxtaposed to its bottom, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-002-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-002.xht">line-box-direction-002</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-003-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-003.xht">line-box-direction-003</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-005-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-005.xht">line-box-direction-005</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: left' and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the line boxes of a left-floated box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-006-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-006.xht">line-box-direction-006</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: left' and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the line boxes of left-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-007-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-007.xht">line-box-direction-007</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: right' and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the line boxes of a right-floated box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-008-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-008.xht">line-box-direction-008</a></strong></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float: right' and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the line boxes of right-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-009-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-009.xht">line-box-direction-009</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>position absolute and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-010-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-010.xht">line-box-direction-010</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>position absolute and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-011-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-011.xht">line-box-direction-011</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-012-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-012.xht">line-box-direction-012</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-013-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-013.xht">line-box-direction-013</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-014-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-014.xht">line-box-direction-014</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>inline-block and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-015-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-015.xht">line-box-direction-015</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-cell and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-016-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-016.xht">line-box-direction-016</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-cell and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-017-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-017.xht">line-box-direction-017</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-caption and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-018-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-018.xht">line-box-direction-018</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>table-caption and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-019-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-019.xht">line-box-direction-019</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>list and 'vertical-rl' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="line-box-direction-020-3.1" class="primary ahem"> + <td><strong> + <a href="line-box-direction-020.xht">line-box-direction-020</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>list and 'vertical-lr' - ordering direction of line boxes + <ul class="assert"> + <li>This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="list-items-vert-rl-005-3.1" class="primary image"> + <td><strong> + <a href="list-items-vert-rl-005.xht">list-items-vert-rl-005</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>order, orientation and layout of list items in a 'vertical-rl' writing-mode + <ul class="assert"> + <li>This test checks the order, the orientation and layout of list items when in a 'vertical-rl' writing mode as illustrated by and according to Example 5 of section 3.1.</li> + </ul> + </td> + </tr> + <tr id="page-flow-direction-002-3.1" class="primary image paged"> + <td><strong> + <a href="page-flow-direction-002.xht">page-flow-direction-002</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td> + <td>'writing-mode: vertical-rl' - default page flow (progression) direction + <ul class="assert"> + <li>This test checks that 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.</li> + </ul> + </td> + </tr> + <tr id="page-flow-direction-003-3.1" class="primary image paged"> + <td><strong> + <a href="page-flow-direction-003.xht">page-flow-direction-003</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="paged" title="Only valid for paged media">Paged</abbr></td> + <td>'writing-mode: vertical-lr' - default page flow (progression) direction + <ul class="assert"> + <li>This test checks that 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.</li> + </ul> + </td> + </tr> + <tr id="replaced-content-image-002-3.1" class="primary should"> + <td><strong> + <a href="replaced-content-image-002.xht">replaced-content-image-002</a></strong></td> + <td></td> + <td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td> + <td>alternate text of image and vertical writing mode + <ul class="assert"> + <li>This test checks that alternate text (latin) of image rotates 90&deg; clockwise in vertical writing mode.</li> + </ul> + </td> + </tr> + <tr id="replaced-content-image-003-3.1" class="primary should"> + <td><strong> + <a href="replaced-content-image-003.xht">replaced-content-image-003</a></strong></td> + <td></td> + <td><abbr class="should" title="Behavior tested is recommended but not required">Recommend</abbr></td> + <td>alternate text of image and vertical writing mode + <ul class="assert"> + <li>This test checks that alternate text (latin) of image rotates 90&deg; clockwise in vertical writing mode.</li> + </ul> + </td> + </tr> + <tr id="row-progression-002-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-002.xht">row-progression-002</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - table rows progression + <ul class="assert"> + <li>This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="row-progression-003-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-003.xht">row-progression-003</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - table rows progression + <ul class="assert"> + <li>This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="row-progression-004-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-004.xht">row-progression-004</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - table rows progression and colspan + <ul class="assert"> + <li>This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.</li> + </ul> + </td> + </tr> + <tr id="row-progression-005-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-005.xht">row-progression-005</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - table rows progression and colspan + <ul class="assert"> + <li>This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.</li> + </ul> + </td> + </tr> + <tr id="row-progression-006-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-006.xht">row-progression-006</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - table rows progression and rowspan + <ul class="assert"> + <li>This test checks that rowspanned cells in a table are handled according to a right-to-left direction.</li> + </ul> + </td> + </tr> + <tr id="row-progression-007-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-007.xht">row-progression-007</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - table rows progression and rowspan + <ul class="assert"> + <li>This test checks that rowspanned cells in a table are handled according to a left-to-right direction.</li> + </ul> + </td> + </tr> + <tr id="row-progression-008-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-008.xht">row-progression-008</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-rl - table rows progression (thead, 2 tbodies, tfoot) + <ul class="assert"> + <li>This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="row-progression-009-3.1" class="primary ahem"> + <td><strong> + <a href="row-progression-009.xht">row-progression-009</a></strong></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>vertical-lr - table rows progression (thead, 2 tbodies, tfoot) + <ul class="assert"> + <li>This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc...</li> + </ul> + </td> + </tr> + <tr id="writing-mode-stretch-001-3.1" class="primary"> + <td><strong> + <a href="writing-mode-stretch-001.xht">writing-mode-stretch-001</a></strong></td> + <td><a href="reference/writing-mode-stretch-001-ref.xht">=</a> </td> + <td></td> + <td>writing-mode vertical-lr and vertical-rl + <ul class="assert"> + <li>vertical-writing-mode flex items should stretch</li> + </ul> + </td> + </tr> + <tr id="writing-mode-vertical-rl-003-3.1" class="primary ahem"> + <td><strong> + <a href="writing-mode-vertical-rl-003.xht">writing-mode-vertical-rl-003</a></strong></td> + <td><a href="reference/writing-mode-vertical-rl-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>writing-mode: horizontal-tb nested in vertical-rl + <ul class="assert"> + <li>when child block has its own writing-mode, child block's writing-mode overwrites parent block's writing-mode.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s3.1.#principal-writing-mode"> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1.#propdef-writing-mode"> + <!-- 11 tests --> + <tr id="autoheight-regions-in-autoheight-flexbox-002-3.1.#propdef-writing-mode" class="ahem"> + <td> + <a href="autoheight-regions-in-autoheight-flexbox-002.xht">autoheight-regions-in-autoheight-flexbox-002</a></td> + <td><a href="reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Regions: Auto-height regions with vertical writing mode in auto-height flexbox + <ul class="assert"> + <li>Test checks that auto-height regions having content with vertical writing mode are sized correctly when placed inside a flex container. The flowed content should be displayed as a horizontal green stripe.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row.xht">css-flexbox-row</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-reverse-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row-reverse.xht">css-flexbox-row-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row-reverse, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-reverse-wrap-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row-reverse-wrap.xht">css-flexbox-row-reverse-wrap</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row-reverse wrap, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-reverse-wrap-reverse-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row-reverse-wrap-reverse.xht">css-flexbox-row-reverse-wrap-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row-reverse wrap-reverse, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-wrap-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row-wrap.xht">css-flexbox-row-wrap</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row wrap, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="css-flexbox-row-wrap-reverse-3.1.#propdef-writing-mode" class=""> + <td> + <a href="css-flexbox-row-wrap-reverse.xht">css-flexbox-row-wrap-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td></td> + <td>flex direction: row, writing mode vertical + <ul class="assert"> + <li>Test checks that when writing mode is vertical and flex-flow: row wrap-reverse, the flex container is vertical.</li> + </ul> + </td> + </tr> + <tr id="extract-ordered-list-direction-and-writing-modes-3.1.#propdef-writing-mode" class=""> + <td> + <a href="extract-ordered-list-direction-and-writing-modes.xht">extract-ordered-list-direction-and-writing-modes</a></td> + <td><a href="reference/extract-ordered-list-direction-and-writing-modes-ref.xht">=</a> </td> + <td></td> + <td>flow-into on list items that use different text directions or writing modes + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="writing-mode-vertical-lr-002-3.1.#propdef-writing-mode" class="primary ahem"> + <td><strong> + <a href="writing-mode-vertical-lr-002.xht">writing-mode-vertical-lr-002</a></strong></td> + <td><a href="reference/writing-mode-vertical-lr-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>writing-mode: vertical-lr - basic inline case + </td> + </tr> + <tr id="writing-mode-vertical-rl-001-3.1.#propdef-writing-mode" class="primary ahem"> + <td><strong> + <a href="writing-mode-vertical-rl-001.xht">writing-mode-vertical-rl-001</a></strong></td> + <td><a href="reference/writing-mode-vertical-rl-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>writing-mode: vertical-rl - basic inline case + </td> + </tr> + <tr id="writing-mode-vertical-rl-002-3.1.#propdef-writing-mode" class="primary ahem"> + <td><strong> + <a href="writing-mode-vertical-rl-002.xht">writing-mode-vertical-rl-002</a></strong></td> + <td><a href="reference/writing-mode-vertical-rl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>writing-mode: vertical-rl - basic inline case + </td> + </tr> + </tbody> + <tbody id="s3.1.#valuedef-horizontal-tb"> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1.#valuedef-vertical-lr"> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1.#valuedef-vertical-rl"> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s3.1.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#svg-writing-mode">3.1.1 SVG1.1 writing-mode Values</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s3.1.1.#inline-progression-direction"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-4.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-4.xht new file mode 100644 index 00000000000..d89e49b46ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-4.xht @@ -0,0 +1,903 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Inline-level Alignment - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Inline-level Alignment (75 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s4"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s4">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#inline-alignment">4 Inline-level Alignment</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s4.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s4.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#intro-baselines">4.1 Introduction to Baselines</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s4.1.#baseline"> + <!-- 0 tests --> + </tbody> + <tbody id="s4.1.#baseline-table"> + <!-- 0 tests --> + </tbody> + <tbody id="s4.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s4.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines">4.2 Text Baselines</a></th></tr> + <!-- 12 tests --> + <tr id="central-baseline-alignment-002-4.2" class="primary ahem"> + <td><strong> + <a href="central-baseline-alignment-002.xht">central-baseline-alignment-002</a></strong></td> + <td><a href="reference/central-baseline-alignment-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>central baseline-alignment of text with 'text-orientation: upright' (vertical-rl) + <ul class="assert"> + <li>This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="central-baseline-alignment-003-4.2" class="primary ahem"> + <td><strong> + <a href="central-baseline-alignment-003.xht">central-baseline-alignment-003</a></strong></td> + <td><a href="reference/central-baseline-alignment-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>central baseline-alignment of text with 'text-orientation: upright' (vertical-lr) + <ul class="assert"> + <li>This test checks that the central baseline is used as the dominant baseline when 'text-orientation' is 'upright' in vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-002-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-002.xht">text-baseline-002</a></strong></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - central alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-003-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-003.xht">text-baseline-003</a></strong></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - central alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-004-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-004.xht">text-baseline-004</a></strong></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - central alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-005-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-005.xht">text-baseline-005</a></strong></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - central alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-006-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-006.xht">text-baseline-006</a></strong></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-007-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-007.xht">text-baseline-007</a></strong></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-008-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-008.xht">text-baseline-008</a></strong></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-009-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-009.xht">text-baseline-009</a></strong></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-010-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-010.xht">text-baseline-010</a></strong></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-left', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="text-baseline-011-4.2" class="primary ahem"> + <td><strong> + <a href="text-baseline-011.xht">text-baseline-011</a></strong></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text baseline alignment - alphabetical alignment with vertical layout + <ul class="assert"> + <li>This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways-left', then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s4.2.#alphabetic-baseline"> + <!-- 0 tests --> + </tbody> + <tbody id="s4.2.#central-baseline"> + <!-- 0 tests --> + </tbody> + <tbody id="s4.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s4.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#replaced-baselines">4.3 Atomic Inline Baselines</a></th></tr> + <!-- 18 tests --> + <tr id="baseline-inline-non-replaced-002-4.3" class="primary ahem"> + <td><strong> + <a href="baseline-inline-non-replaced-002.xht">baseline-inline-non-replaced-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>baseline-alignment of empty non-replaced inline-block element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="baseline-inline-non-replaced-003-4.3" class="primary ahem"> + <td><strong> + <a href="baseline-inline-non-replaced-003.xht">baseline-inline-non-replaced-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>baseline-alignment of empty non-replaced inline-block element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the baseline-alignment of an empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="baseline-inline-non-replaced-004-4.3" class="primary ahem"> + <td><strong> + <a href="baseline-inline-non-replaced-004.xht">baseline-inline-non-replaced-004</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="baseline-inline-non-replaced-005-4.3" class="primary ahem"> + <td><strong> + <a href="baseline-inline-non-replaced-005.xht">baseline-inline-non-replaced-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the baseline-alignment of a non-empty inline-block box in the line box with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="baseline-inline-replaced-002-4.3" class="primary ahem image"> + <td><strong> + <a href="baseline-inline-replaced-002.xht">baseline-inline-replaced-002</a></strong></td> + <td><a href="reference/baseline-inline-replaced-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>baseline-alignment of inline replaced element and 'vertical-rl' + <ul class="assert"> + <li>This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-rl' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="baseline-inline-replaced-003-4.3" class="primary ahem image"> + <td><strong> + <a href="baseline-inline-replaced-003.xht">baseline-inline-replaced-003</a></strong></td> + <td><a href="reference/baseline-inline-replaced-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>baseline-alignment of inline replaced element and 'vertical-lr' + <ul class="assert"> + <li>This test checks that the baseline-alignment of an image in the line box of a block with 'writing-mode' set to 'vertical-lr' is 'central' and not 'alphabetic'.</li> + </ul> + </td> + </tr> + <tr id="inline-block-alignment-001-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-001.xht">inline-block-alignment-001</a></strong></td> + <td><a href="reference/inline-block-alignment-001-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block with content (alphabetical alignment with horizontal layout) + <ul class="assert"> + <li>This test checks the generation of inline-block baseline. When 'writing-mode' is horizontal, then the alphabetical baseline is used as the dominant baseline.</li> + </ul> + </td> + </tr> + <tr id="inline-block-alignment-002-sidewaysleft-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-002-sidewaysleft.xht">inline-block-alignment-002-sidewaysleft</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block with content (alphabetical alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of inline-block baseline. 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="inline-block-alignment-002-sidewaysright-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-002-sidewaysright.xht">inline-block-alignment-002-sidewaysright</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block with content (alphabetical alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of inline-block baseline. 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="inline-block-alignment-003-lr-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-block-alignment-003-lr.xht">inline-block-alignment-003-lr</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>inline-block alignment - inline-block with content (central alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of inline-block baseline. 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="inline-block-alignment-003-rl-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-block-alignment-003-rl.xht">inline-block-alignment-003-rl</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>inline-block alignment - inline-block with content (central alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of inline-block baseline. 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="inline-block-alignment-004-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-004.xht">inline-block-alignment-004</a></strong></td> + <td><a href="reference/inline-block-alignment-004-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block without content (alphabetical alignment with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="inline-block-alignment-005-sidewaysleft-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-005-sidewaysleft.xht">inline-block-alignment-005-sidewaysleft</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block without content (alphabetical alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of empty inline-block baseline. 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="inline-block-alignment-005-sidewaysright-4.3" class="primary image"> + <td><strong> + <a href="inline-block-alignment-005-sidewaysright.xht">inline-block-alignment-005-sidewaysright</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline-block alignment - inline-block without content (alphabetical alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of empty inline-block baseline. 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="inline-block-alignment-006-lr-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-block-alignment-006-lr.xht">inline-block-alignment-006-lr</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>inline-block alignment - inline-block without content (central alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of empty inline-block baseline. 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="inline-block-alignment-006-rl-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-block-alignment-006-rl.xht">inline-block-alignment-006-rl</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>inline-block alignment - inline-block without content (central alignment with vertical layout) + <ul class="assert"> + <li>This test checks the generation of empty inline-block baseline. 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="inline-replaced-vlr-005-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-replaced-vlr-005.xht">inline-replaced-vlr-005</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline replaced element and 'vertical-lr' (advanced) + <ul class="assert"> + <li>This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from left to right.</li> + </ul> + </td> + </tr> + <tr id="inline-replaced-vrl-004-4.3" class="primary ahem image"> + <td><strong> + <a href="inline-replaced-vrl-004.xht">inline-replaced-vrl-004</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>inline replaced element and 'vertical-rl' (advanced) + <ul class="assert"> + <li>This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from right to left.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s4.4"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s4.4">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#baseline-alignment">4.4 Baseline Alignment</a></th></tr> + <!-- 45 tests --> + <tr id="vertical-alignment-001-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-001.xht">vertical-alignment-001</a></strong></td> + <td><a href="reference/vertical-alignment-001-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>vertical align - 'baseline' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-002-sidewaysleft-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-002-sidewaysleft.xht">vertical-alignment-002-sidewaysleft</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-002-sidewaysright-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-002-sidewaysright.xht">vertical-alignment-002-sidewaysright</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-003-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-003-lr.xht">vertical-alignment-003-lr</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-003-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-003-rl.xht">vertical-alignment-003-rl</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-004-4.4" class="primary image"> + <td><strong> + <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="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>vertical align - 'sub' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-005-sidewaysleft-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-005-sidewaysleft.xht">vertical-alignment-005-sidewaysleft</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-005-sidewaysright-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-005-sidewaysright.xht">vertical-alignment-005-sidewaysright</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-006-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-006-lr.xht">vertical-alignment-006-lr</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 - 'sub' (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-006-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-006-rl.xht">vertical-alignment-006-rl</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 - 'sub' (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-007-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-007.xht">vertical-alignment-007</a></strong></td> + <td><a href="reference/vertical-alignment-007-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>vertical align - 'super' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-008-sidewaysleft-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-008-sidewaysleft.xht">vertical-alignment-008-sidewaysleft</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-008-sidewaysright-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-008-sidewaysright.xht">vertical-alignment-008-sidewaysright</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-009-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-009-lr.xht">vertical-alignment-009-lr</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 - 'super' (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-009-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-009-rl.xht">vertical-alignment-009-rl</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 - 'super' (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-010-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-010.xht">vertical-alignment-010</a></strong></td> + <td><a href="reference/vertical-alignment-010-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>vertical align - 'zero length (0em)' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-011-sidewaysleft-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-011-sidewaysleft.xht">vertical-alignment-011-sidewaysleft</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-011-sidewaysright-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-011-sidewaysright.xht">vertical-alignment-011-sidewaysright</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-012-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-012-lr.xht">vertical-alignment-012-lr</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-012-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-012-rl.xht">vertical-alignment-012-rl</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-013-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-013.xht">vertical-alignment-013</a></strong></td> + <td><a href="reference/vertical-alignment-013-ref.xht">=</a> </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 horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-014-sidewaysleft-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-014-sidewaysleft.xht">vertical-alignment-014-sidewaysleft</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-014-sidewaysright-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-014-sidewaysright.xht">vertical-alignment-014-sidewaysright</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-015-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-015-lr.xht">vertical-alignment-015-lr</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-015-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-015-rl.xht">vertical-alignment-015-rl</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-016-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-016.xht">vertical-alignment-016</a></strong></td> + <td><a href="reference/vertical-alignment-016-ref.xht">=</a> </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 horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-017-sidewaysleft-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-017-sidewaysleft.xht">vertical-alignment-017-sidewaysleft</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-017-sidewaysright-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-017-sidewaysright.xht">vertical-alignment-017-sidewaysright</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-018-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-018-lr.xht">vertical-alignment-018-lr</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-018-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-018-rl.xht">vertical-alignment-018-rl</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-019-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-019.xht">vertical-alignment-019</a></strong></td> + <td><a href="reference/vertical-alignment-019-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>vertical align - 'zero percentage (0%)' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-020-sidewaysleft-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-020-sidewaysleft.xht">vertical-alignment-020-sidewaysleft</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-020-sidewaysright-4.4" class="primary image"> + <td><strong> + <a href="vertical-alignment-020-sidewaysright.xht">vertical-alignment-020-sidewaysright</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-021-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-021-lr.xht">vertical-alignment-021-lr</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-021-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-021-rl.xht">vertical-alignment-021-rl</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-022-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-022.xht">vertical-alignment-022</a></strong></td> + <td><a href="reference/vertical-alignment-022-ref.xht">=</a> </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 horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-023-sidewaysleft-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-023-sidewaysleft.xht">vertical-alignment-023-sidewaysleft</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-023-sidewaysright-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-023-sidewaysright.xht">vertical-alignment-023-sidewaysright</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-024-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-024-lr.xht">vertical-alignment-024-lr</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-024-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-024-rl.xht">vertical-alignment-024-rl</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-025-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-025.xht">vertical-alignment-025</a></strong></td> + <td><a href="reference/vertical-alignment-025-ref.xht">=</a> </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 percent (-20%)' (alphabetical baseline with horizontal layout) + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="vertical-alignment-026-sidewaysleft-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-026-sidewaysleft.xht">vertical-alignment-026-sidewaysleft</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-026-sidewaysright-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-026-sidewaysright.xht">vertical-alignment-026-sidewaysright</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-027-lr-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-027-lr.xht">vertical-alignment-027-lr</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-027-rl-4.4" class="primary ahem image"> + <td><strong> + <a href="vertical-alignment-027-rl.xht">vertical-alignment-027-rl</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> + </tbody> + <tbody id="s4.4.#dominant-baseline"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-5.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-5.xht new file mode 100644 index 00000000000..a4d75041ba8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-5.xht @@ -0,0 +1,237 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Introduction to Vertical Text Layout - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Introduction to Vertical Text Layout (12 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s5"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s5">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#intro-text-layout">5 Introduction to Vertical Text Layout</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#bi-orientational"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#bi-orientational----transform"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#horizontal-only"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#horizontal-script"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#vertical-only"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.#vertical-script"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s5.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">5.1 Orienting Text: the text-orientation property</a></th></tr> + <!-- 12 tests --> + <tr id="text-orientation-010-5.1" class="primary ahem font"> + <td><strong> + <a href="text-orientation-010.xht">text-orientation-010</a></strong></td> + <td><a href="reference/text-orientation-010-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="font" title="Requires a special font">Font</abbr></td> + <td>text-orientation - mixed + <ul class="assert"> + <li>This test checks that 'text-orientation: mixed' causes characters from horizontal-only scripts are set sideways, i.e. 90&deg;clockwise from their standard orientation in horizontal text. Characters from vertical scripts are set with their intrinsic orientation. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-011-5.1" class="primary ahem font"> + <td><strong> + <a href="text-orientation-011.xht">text-orientation-011</a></strong></td> + <td><a href="reference/text-orientation-011-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="font" title="Requires a special font">Font</abbr></td> + <td>text-orientation - upright + <ul class="assert"> + <li>This test checks that 'text-orientation: upright' causes characters from horizontal-only scripts are rendered upright, i.e. in their standard horizontal orientation, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-012-5.1" class="primary ahem"> + <td><strong> + <a href="text-orientation-012.xht">text-orientation-012</a></strong></td> + <td><a href="reference/text-orientation-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text-orientation - sideways-right + <ul class="assert"> + <li>This test checks that 'text-orientation: sideways-right' causes text to be set as if in a horizontal layout, but rotated 90&deg; clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-013-5.1" class="primary ahem"> + <td><strong> + <a href="text-orientation-013.xht">text-orientation-013</a></strong></td> + <td><a href="reference/text-orientation-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text-orientation - sideways-left + <ul class="assert"> + <li>This test checks that 'text-orientation: sideways-left' causes text to be set as if in a horizontal layout, but rotated 90&deg;counter-clockwise, in vertical writing modes. It's effective to verify 1.block flow direction and 2.inline direction, but not effective to verify 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-014-5.1" class="primary ahem"> + <td><strong> + <a href="text-orientation-014.xht">text-orientation-014</a></strong></td> + <td><a href="reference/text-orientation-014-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text-orientation - sideways + <ul class="assert"> + <li>This test checks that 'text-orientation: sideways' is equivalent to&#8216;sideways-right&#8217;in&#8216;vertical-rl&#8217;writing mode. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-015-5.1" class="primary ahem"> + <td><strong> + <a href="text-orientation-015.xht">text-orientation-015</a></strong></td> + <td><a href="reference/text-orientation-015-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>text-orientation - sideways + <ul class="assert"> + <li>This test checks that 'text-orientation: sideways' is equivalent to&#8216;sideways-left&#8217;in&#8216;vertical-lr&#8217;writing mode. This is effective to verify 1.block flow direction, 2.inline direction, but not effetive to verify 3.glyph orientation.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-mixed-001-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-mixed-001.xht">text-orientation-mixed-001</a></strong></td> + <td><a href="reference/text-orientation-mixed-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - mixed in vertical-rl writing mode + <ul class="assert"> + <li>This test checks that the alphabet is displayed on sideways, and it is verified whether the characters are aligned in the vertical direction including vertical writing characters (Japanese, Mongolian, Hangul, etc).</li> + </ul> + </td> + </tr> + <tr id="text-orientation-sideways-001-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-sideways-001.xht">text-orientation-sideways-001</a></strong></td> + <td><a href="reference/text-orientation-sideways-right-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - sideways in vertical-rl writing mode + <ul class="assert"> + <li>This test checks that the same as [text-orientation: sideways-right], general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-sideways-002-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-sideways-002.xht">text-orientation-sideways-002</a></strong></td> + <td><a href="reference/text-orientation-sideways-left-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - sideways in vertical-lr writing mode + <ul class="assert"> + <li>This test checks that the same as [text-orientation: sideways-left], general horizontal text(include Japanese,etc) rotates 90 degrees counter-clockwise, and it is verified whether the characters are aligned in the vertical direction.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-sideways-left-001-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-sideways-left-001.xht">text-orientation-sideways-left-001</a></strong></td> + <td><a href="reference/text-orientation-sideways-left-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - sideways-left in vertical-rl writing mode + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-sideways-right-001-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-sideways-right-001.xht">text-orientation-sideways-right-001</a></strong></td> + <td><a href="reference/text-orientation-sideways-right-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - sideways-right in vertical-rl writing mode + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="text-orientation-upright-001-5.1" class="primary font image"> + <td><strong> + <a href="text-orientation-upright-001.xht">text-orientation-upright-001</a></strong></td> + <td><a href="reference/text-orientation-upright-001-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>text-orientation - upright in vertical-rl writing mode + <ul class="assert"> + <li>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).</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s5.1.#fig-text-orientation"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#propdef-text-orientation"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-mixed"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-sideways"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-sideways-left"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-sideways-right"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-upright"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.#valuedef-use-glyph-orientation"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s5.1.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#vertical-font-features">5.1.1 Vertical Typesetting and Font Features</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.1.#typeset-sideways"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.1.#typeset-upright"> + <!-- 0 tests --> + </tbody> + <tbody id="s5.1.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s5.1.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#vertical-orientations">5.1.2 Mixed Vertical Orientations</a></th></tr> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-6.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-6.xht new file mode 100644 index 00000000000..6564dca96d3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-6.xht @@ -0,0 +1,224 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Abstract Box Terminology - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Abstract Box Terminology (4 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s6"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s6">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#abstract-box">6 Abstract Box Terminology</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#bottom"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#flow-relative"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#height"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#horizontal-dimension"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#left"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#line-relative"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#physical"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#physical-dimensions"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#physical-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#right"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#top"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#vertical-dimension"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#width"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#x-axis"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.#y-axis"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s6.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#abstract-dimensions">6.1 Abstract Dimensions</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#abstract-dimensions0"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#block-axis-"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#block-dimension"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#extent"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#inline-axis-"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#inline-dimension"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#logical-height"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#logical-width"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.1.#measure"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s6.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#logical-directions">6.2 Flow-relative Directions</a></th></tr> + <!-- 4 tests --> + <tr id="direction-vlr-003-6.2" class="primary ahem image"> + <td><strong> + <a href="direction-vlr-003.xht">direction-vlr-003</a></strong></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that when a block box has 'direction' set to 'rtl' in a vertical writing-mode, then inlines boxes are aligned from line-right to line-left.</li> + </ul> + </td> + </tr> + <tr id="direction-vlr-005-6.2" class="primary ahem image"> + <td><strong> + <a href="direction-vlr-005.xht">direction-vlr-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and 'direction: ltr' + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + <tr id="direction-vrl-002-6.2" class="primary ahem image"> + <td><strong> + <a href="direction-vrl-002.xht">direction-vrl-002</a></strong></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that when a block box has 'direction' set to 'rtl' in a vertical writing-mode, then inlines boxes are aligned from line-right to line-left.</li> + </ul> + </td> + </tr> + <tr id="direction-vrl-004-6.2" class="primary ahem image"> + <td><strong> + <a href="direction-vrl-004.xht">direction-vrl-004</a></strong></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and 'direction: ltr' + <ul class="assert"> + <li>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.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s6.2.#block-end"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#block-start"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#end"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#flow-relative-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#inline-end"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#inline-start"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.2.#start"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s6.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#line-directions">6.3 Line-relative Directions</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-left"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-orientation"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-over"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-relative-direction"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-right"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#line-under"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#over"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.3.#under"> + <!-- 0 tests --> + </tbody> + <tbody id="s6.4"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s6.4">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#logical-to-physical">6.4 Abstract-to-Physical Mappings</a></th></tr> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-7.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-7.xht new file mode 100644 index 00000000000..db2b75af00e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-7.xht @@ -0,0 +1,2606 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Abstract Box Layout - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Abstract Box Layout (229 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s7"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#abstract-layout">7 Abstract Box Layout</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout">7.1 Principles of Layout in Vertical Writing Modes</a></th></tr> + <!-- 177 tests --> + <tr id="abs-pos-non-replaced-vlr-003-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-003.xht">abs-pos-non-replaced-vlr-003</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-005-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-005.xht">abs-pos-non-replaced-vlr-005</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-007-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-007.xht">abs-pos-non-replaced-vlr-007</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-009-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-009.xht">abs-pos-non-replaced-vlr-009</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-011-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-011.xht">abs-pos-non-replaced-vlr-011</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-013-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-013.xht">abs-pos-non-replaced-vlr-013</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-015-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-015.xht">abs-pos-non-replaced-vlr-015</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' are 'auto' and bottom is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-017-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-017.xht">abs-pos-non-replaced-vlr-017</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-019-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-019.xht">abs-pos-non-replaced-vlr-019</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-021-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-021.xht">abs-pos-non-replaced-vlr-021</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-023-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-023.xht">abs-pos-non-replaced-vlr-023</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-025-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-025.xht">abs-pos-non-replaced-vlr-025</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-027-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-027.xht">abs-pos-non-replaced-vlr-027</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-029-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-029.xht">abs-pos-non-replaced-vlr-029</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'left' to the static position and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-031-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-031.xht">abs-pos-non-replaced-vlr-031</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-033-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-033.xht">abs-pos-non-replaced-vlr-033</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-035-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-035.xht">abs-pos-non-replaced-vlr-035</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'right' to the static position and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-037-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-037.xht">abs-pos-non-replaced-vlr-037</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-039-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-039.xht">abs-pos-non-replaced-vlr-039</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-041-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-041.xht">abs-pos-non-replaced-vlr-041</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-043-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-043.xht">abs-pos-non-replaced-vlr-043</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-045-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-045.xht">abs-pos-non-replaced-vlr-045</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-047-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-047.xht">abs-pos-non-replaced-vlr-047</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-049-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-049.xht">abs-pos-non-replaced-vlr-049</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-051-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-051.xht">abs-pos-non-replaced-vlr-051</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-053-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-053.xht">abs-pos-non-replaced-vlr-053</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-055-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-055.xht">abs-pos-non-replaced-vlr-055</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-057-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-057.xht">abs-pos-non-replaced-vlr-057</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-059-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-059.xht">abs-pos-non-replaced-vlr-059</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left', then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-061-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-061.xht">abs-pos-non-replaced-vlr-061</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-063-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-063.xht">abs-pos-non-replaced-vlr-063</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-065-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-065.xht">abs-pos-non-replaced-vlr-065</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-067-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-067.xht">abs-pos-non-replaced-vlr-067</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-069-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-069.xht">abs-pos-non-replaced-vlr-069</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-071-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-071.xht">abs-pos-non-replaced-vlr-071</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-073-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-073.xht">abs-pos-non-replaced-vlr-073</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-075-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-075.xht">abs-pos-non-replaced-vlr-075</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-077-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-077.xht">abs-pos-non-replaced-vlr-077</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-079-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-079.xht">abs-pos-non-replaced-vlr-079</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-081-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-081.xht">abs-pos-non-replaced-vlr-081</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-083-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-083.xht">abs-pos-non-replaced-vlr-083</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-085-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-085.xht">abs-pos-non-replaced-vlr-085</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-087-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-087.xht">abs-pos-non-replaced-vlr-087</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-089-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-089.xht">abs-pos-non-replaced-vlr-089</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained), then ignore 'right' and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-091-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-091.xht">abs-pos-non-replaced-vlr-091</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-093-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-093.xht">abs-pos-non-replaced-vlr-093</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-095-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-095.xht">abs-pos-non-replaced-vlr-095</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left', 'width' and 'right' are not 'auto' and if the values are overconstrained, then ignore 'left' and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vlr-097-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vlr-097.xht">abs-pos-non-replaced-vlr-097</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-002-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-002.xht">abs-pos-non-replaced-vrl-002</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-004.xht">abs-pos-non-replaced-vrl-004</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-006-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-006.xht">abs-pos-non-replaced-vrl-006</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-008-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-008.xht">abs-pos-non-replaced-vrl-008</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-010-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-010.xht">abs-pos-non-replaced-vrl-010</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left', 'width' and 'right' are 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-012-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-012.xht">abs-pos-non-replaced-vrl-012</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-014-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-014.xht">abs-pos-non-replaced-vrl-014</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-016-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-016.xht">abs-pos-non-replaced-vrl-016</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-018-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-018.xht">abs-pos-non-replaced-vrl-018</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-020-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-020.xht">abs-pos-non-replaced-vrl-020</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-022-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-022.xht">abs-pos-non-replaced-vrl-022</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto', then the width becomes shrink-to-fit and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-024-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-024.xht">abs-pos-non-replaced-vrl-024</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto', then the height becomes shrink-to-fit and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-026-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-026.xht">abs-pos-non-replaced-vrl-026</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-028-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-028.xht">abs-pos-non-replaced-vrl-028</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'left' to the static position and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-030-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-030.xht">abs-pos-non-replaced-vrl-030</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto', then set 'top' to static position and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-032-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-032.xht">abs-pos-non-replaced-vrl-032</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-034-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-034.xht">abs-pos-non-replaced-vrl-034</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto', then set 'right' to the static position and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-036-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-036.xht">abs-pos-non-replaced-vrl-036</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto', then set 'bottom' to static position and then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-038-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-038.xht">abs-pos-non-replaced-vrl-038</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-040-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-040.xht">abs-pos-non-replaced-vrl-040</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-042-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-042.xht">abs-pos-non-replaced-vrl-042</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-044-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-044.xht">abs-pos-non-replaced-vrl-044</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-046-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-046.xht">abs-pos-non-replaced-vrl-046</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto', then the width becomes shrink-to-fit and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-048-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-048.xht">abs-pos-non-replaced-vrl-048</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto', then the height becomes shrink-to-fit and then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-050-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-050.xht">abs-pos-non-replaced-vrl-050</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-052-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-052.xht">abs-pos-non-replaced-vrl-052</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-054-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-054.xht">abs-pos-non-replaced-vrl-054</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-056-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-056.xht">abs-pos-non-replaced-vrl-056</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-058-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-058.xht">abs-pos-non-replaced-vrl-058</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left', then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-060-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-060.xht">abs-pos-non-replaced-vrl-060</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto', then solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-062-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-062.xht">abs-pos-non-replaced-vrl-062</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-064-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-064.xht">abs-pos-non-replaced-vrl-064</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-066-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-066.xht">abs-pos-non-replaced-vrl-066</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-068-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-068.xht">abs-pos-non-replaced-vrl-068</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-070-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-070.xht">abs-pos-non-replaced-vrl-070</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto', then solve for 'width'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-072-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-072.xht">abs-pos-non-replaced-vrl-072</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto', then then solve for 'height'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-074-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-074.xht">abs-pos-non-replaced-vrl-074</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-076-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-076.xht">abs-pos-non-replaced-vrl-076</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-078-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-078.xht">abs-pos-non-replaced-vrl-078</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-080-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-080.xht">abs-pos-non-replaced-vrl-080</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-082-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-082.xht">abs-pos-non-replaced-vrl-082</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto', then solve for 'right'</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-084-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-084.xht">abs-pos-non-replaced-vrl-084</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto', then solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-086-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-086.xht">abs-pos-non-replaced-vrl-086</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-088-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-088.xht">abs-pos-non-replaced-vrl-088</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained), then ignore 'right' and then solve for 'right'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-090-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-090.xht">abs-pos-non-replaced-vrl-090</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'ltr' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'bottom' and solve for 'bottom'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-092-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-092.xht">abs-pos-non-replaced-vrl-092</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained) + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-094-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-094.xht">abs-pos-non-replaced-vrl-094</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'left', 'width' and 'right' are not 'auto' and if the values are overconstrained, then ignore 'left' and then solve for 'left'.</li> + </ul> + </td> + </tr> + <tr id="abs-pos-non-replaced-vrl-096-7.1" class="primary ahem image"> + <td><strong> + <a href="abs-pos-non-replaced-vrl-096.xht">abs-pos-non-replaced-vrl-096</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' + <ul class="assert"> + <li>When 'direction' is 'rtl' and 'top', 'height' and 'bottom' are not 'auto' and if the values are overconstrained, then ignore 'top' and solve for 'top'.</li> + </ul> + </td> + </tr> + <tr id="border-vlr-007-7.1" class="primary image"> + <td><strong> + <a href="border-vlr-007.xht">border-vlr-007</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>border in 'vertical-lr' writing-mode context + <ul class="assert"> + <li>This test checks that border-left, border-right, border-top and border-bottom do not change in vertical writing-mode. The border-left property of a box still affects the lefthand border of such box.</li> + </ul> + </td> + </tr> + <tr id="border-vrl-006-7.1" class="primary image"> + <td><strong> + <a href="border-vrl-006.xht">border-vrl-006</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>border in 'vertical-rl' writing-mode context + <ul class="assert"> + <li>This test checks that border-left, border-right, border-top and border-bottom do not change in vertical writing-mode. The border-left property of a box still affects the lefthand border of such box.</li> + </ul> + </td> + </tr> + <tr id="box-offsets-rel-pos-vlr-003-7.1" class="primary image"> + <td><strong> + <a href="box-offsets-rel-pos-vlr-003.xht">box-offsets-rel-pos-vlr-003</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>box offsets - position relative + <ul class="assert"> + <li>The 'top', 'right', 'bottom', 'left' property, for relative positioning, specify the offset of the box itself from its normal in-flow position, from the position it would have had if it had been static. The 'top', 'right', 'bottom', 'left' offset property are physical properties, not logical ones in vertical writing-modes.</li> + </ul> + </td> + </tr> + <tr id="box-offsets-rel-pos-vlr-005-7.1" class="primary image"> + <td><strong> + <a href="box-offsets-rel-pos-vlr-005.xht">box-offsets-rel-pos-vlr-005</a></strong></td> + <td><a href="reference/box-offsets-rel-pos-vlr-005-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>box offsets - relatively positioned boxes + <ul class="assert"> + <li>Box offsets (bottom, left, right, top) expressed in absolute units (not with percentage unit) for relatively positioned boxes are with respect to the edges of the boxes themselves.</li> + </ul> + </td> + </tr> + <tr id="box-offsets-rel-pos-vrl-002-7.1" class="primary image"> + <td><strong> + <a href="box-offsets-rel-pos-vrl-002.xht">box-offsets-rel-pos-vrl-002</a></strong></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>box offsets - position relative + <ul class="assert"> + <li>The 'top', 'right', 'bottom', 'left' property, for relative positioning, specify the offset of the box itself from its normal in-flow position, from the position it would have had if it had been static. The 'top', 'right', 'bottom', 'left' offset property are physical properties, not logical ones in vertical writing-modes.</li> + </ul> + </td> + </tr> + <tr id="box-offsets-rel-pos-vrl-004-7.1" class="primary image"> + <td><strong> + <a href="box-offsets-rel-pos-vrl-004.xht">box-offsets-rel-pos-vrl-004</a></strong></td> + <td><a href="reference/box-offsets-rel-pos-vrl-004-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>box offsets - relatively positioned boxes + <ul class="assert"> + <li>Box offsets (bottom, left, right, top) expressed in absolute units (not with percentage unit) for relatively positioned boxes are with respect to the edges of the boxes themselves.</li> + </ul> + </td> + </tr> + <tr id="clearance-calculations-vrl-002-7.1" class="primary ahem image"> + <td><strong> + <a href="clearance-calculations-vrl-002.xht">clearance-calculations-vrl-002</a></strong></td> + <td><a href="reference/clearance-calculations-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>Clearance calculations - clearing box has larger margin than width of float + <ul class="assert"> + <li>This test checks that when a clearing element has a right margin (in a block formating context with 'writing-mode' set to 'vertical-rl') larger than the width of a floated element, then the right margin is collapsed with the margin-left of preceding in-flow sibling. The clearing element is then placed at the point of the resulting collapsed margin.</li> + </ul> + </td> + </tr> + <tr id="clearance-calculations-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="clearance-calculations-vrl-004.xht">clearance-calculations-vrl-004</a></strong></td> + <td><a href="reference/clearance-calculations-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>Clearance calculations - clearing box has narrower margin than clearance + <ul class="assert"> + <li>This test checks that if, after margin collapsing, the position of the clearing element is on the right of the float or would be hypothetically positioned within the layout position of the float, then the clearing element is positioned directly on the left of the floated element.</li> + </ul> + </td> + </tr> + <tr id="clearance-calculations-vrl-006-7.1" class="primary ahem image"> + <td><strong> + <a href="clearance-calculations-vrl-006.xht">clearance-calculations-vrl-006</a></strong></td> + <td><a href="reference/clearance-calculations-vrl-006-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>Clearance calculations - clearing box has larger margin than width of float + <ul class="assert"> + <li>This test checks that when a clearing element (in a block formating context with 'writing-mode' set to 'vertical-rl') has a right margin larger than the width of a floated element, then the right margin is collapsed with the margin-left of preceding in-flow sibling. The clearing element is then placed at the point of the resulting collapsed margin.</li> + </ul> + </td> + </tr> + <tr id="clearance-calculations-vrl-008-7.1" class="primary image"> + <td><strong> + <a href="clearance-calculations-vrl-008.xht">clearance-calculations-vrl-008</a></strong></td> + <td><a href="reference/clearance-calculations-vrl-008-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>clearance calculations + <ul class="assert"> + <li>In this test, the right border edge of div#clearing-left must be on the left side of div#floated-left, i.e., 50px further on its left-hand side. That means that the margin-left of div#preceding-sibling must not collapse with the right margin of the div#clearing-left and clearance must be added such that clearance + margin-right of div#clearing-left = 50px, i.e., clearance = 50px - margin-right of div#clearing-left; therefore clearance is equal to 50px - 75px = - 25px.</li> + </ul> + </td> + </tr> + <tr id="float-clear-vlr-003-7.1" class="primary ahem image"> + <td><strong> + <a href="float-clear-vlr-003.xht">float-clear-vlr-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' and 'clear: right' in 'vertical-lr' block formating context (basic) + </td> + </tr> + <tr id="float-clear-vlr-005-7.1" class="primary ahem image"> + <td><strong> + <a href="float-clear-vlr-005.xht">float-clear-vlr-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'clear: left' in 'vertical-lr' block formating context (basic) + </td> + </tr> + <tr id="float-clear-vlr-007-7.1" class="primary image"> + <td><strong> + <a href="float-clear-vlr-007.xht">float-clear-vlr-007</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'clear: left' in 'vertical-lr' block formating context (intermediate) + <ul class="assert"> + <li>This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats.</li> + </ul> + </td> + </tr> + <tr id="float-clear-vlr-009-7.1" class="primary image"> + <td><strong> + <a href="float-clear-vlr-009.xht">float-clear-vlr-009</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right', 'float: left' and 'clear: both' in 'vertical-lr' block formating context (intermediate) + <ul class="assert"> + <li>This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats.</li> + </ul> + </td> + </tr> + <tr id="float-clear-vrl-002-7.1" class="primary ahem image"> + <td><strong> + <a href="float-clear-vrl-002.xht">float-clear-vrl-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' and 'clear: right' in 'vertical-rl' block formating context (basic) + </td> + </tr> + <tr id="float-clear-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="float-clear-vrl-004.xht">float-clear-vrl-004</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'clear: left' in 'vertical-rl' block formating context (basic) + </td> + </tr> + <tr id="float-clear-vrl-006-7.1" class="primary image"> + <td><strong> + <a href="float-clear-vrl-006.xht">float-clear-vrl-006</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'clear: left' in 'vertical-rl' block formating context (intermediate) + <ul class="assert"> + <li>This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats.</li> + </ul> + </td> + </tr> + <tr id="float-clear-vrl-008-7.1" class="primary image"> + <td><strong> + <a href="float-clear-vrl-008.xht">float-clear-vrl-008</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right', 'float: left' and 'clear: both' in 'vertical-rl' block formating context (intermediate) + <ul class="assert"> + <li>This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-003-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vlr-003.xht">float-contiguous-vlr-003</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous left-floating boxes in a 'vertical-lr' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-005-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vlr-005.xht">float-contiguous-vlr-005</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous right-floating boxes in a 'vertical-lr' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-007-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vlr-007.xht">float-contiguous-vlr-007</a></strong></td> + <td><a href="reference/float-contiguous-vlr-007-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous left-floating boxes in a 'vertical-lr' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-009-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vlr-009.xht">float-contiguous-vlr-009</a></strong></td> + <td><a href="reference/float-contiguous-vlr-009-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous right-floating boxes in a 'vertical-lr' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-011-7.1" class="primary ahem"> + <td><strong> + <a href="float-contiguous-vlr-011.xht">float-contiguous-vlr-011</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>contiguous left-floating boxes with 'writing-mode' set to 'vertical-lr' + <ul class="assert"> + <li>This test checks the flow of contiguous left-floated boxes with 'writing-mode' set to 'vertical-lr'.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vlr-013-7.1" class="primary ahem"> + <td><strong> + <a href="float-contiguous-vlr-013.xht">float-contiguous-vlr-013</a></strong></td> + <td><a href="reference/float-contiguous-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>contiguous right-floating boxes with 'writing-mode' set to 'vertical-lr' + <ul class="assert"> + <li>This test checks the flow of contiguous right-floated boxes with 'writing-mode' set to 'vertical-lr'.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-002-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vrl-002.xht">float-contiguous-vrl-002</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous left-floating boxes in a 'vertical-rl' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="float-contiguous-vrl-004.xht">float-contiguous-vrl-004</a></strong></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous right-floating boxes in a 'vertical-rl' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes, otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-006-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vrl-006.xht">float-contiguous-vrl-006</a></strong></td> + <td><a href="reference/float-contiguous-vrl-006-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous left-floating boxes in a 'vertical-rl' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-008-7.1" class="primary image"> + <td><strong> + <a href="float-contiguous-vrl-008.xht">float-contiguous-vrl-008</a></strong></td> + <td><a href="reference/float-contiguous-vrl-008-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>contiguous right-floating boxes in a 'vertical-rl' block formating context + <ul class="assert"> + <li>This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes, otherwise (if there is not enough available horizontal space) below the margin box of the earlier box.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-010-7.1" class="primary ahem"> + <td><strong> + <a href="float-contiguous-vrl-010.xht">float-contiguous-vrl-010</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>contiguous left-floating boxes with 'writing-mode' set to 'vertical-rl' + <ul class="assert"> + <li>This test checks the flow of contiguous left-floated boxes with 'writing-mode' set to 'vertical-rl'.</li> + </ul> + </td> + </tr> + <tr id="float-contiguous-vrl-012-7.1" class="primary ahem"> + <td><strong> + <a href="float-contiguous-vrl-012.xht">float-contiguous-vrl-012</a></strong></td> + <td><a href="reference/float-contiguous-vrl-012-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>contiguous right-floating boxes with 'writing-mode' set to 'vertical-rl' + <ul class="assert"> + <li>This test checks the flow of contiguous right-floated boxes with 'writing-mode' set to 'vertical-rl'.</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vlr-003-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vlr-003.xht">float-shrink-to-fit-vlr-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-lr' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vlr-005-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vlr-005.xht">float-shrink-to-fit-vlr-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-lr' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vlr-007-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vlr-007.xht">float-shrink-to-fit-vlr-007</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-lr' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vlr-009-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vlr-009.xht">float-shrink-to-fit-vlr-009</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-lr' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' applying on logical width must not reduce content but size to fit to its content. In this test, 'L' and 'R' glyphs must be rendered.</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vrl-002-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vrl-002.xht">float-shrink-to-fit-vrl-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-rl' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vrl-004-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vrl-004.xht">float-shrink-to-fit-vrl-004</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-rl' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vrl-006-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vrl-006.xht">float-shrink-to-fit-vrl-006</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width in 'vertical-rl' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' width is applied on logical width (measure).</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vrl-008-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vrl-008.xht">float-shrink-to-fit-vrl-008</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-rl' context + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' applying on logical width must not reduce content but size to fit to its content. In this test, 'L' and 'R' glyphs must be rendered.</li> + </ul> + </td> + </tr> + <tr id="float-shrink-to-fit-vrl-vlr-016-7.1" class="primary ahem"> + <td><strong> + <a href="float-shrink-to-fit-vrl-vlr-016.xht">float-shrink-to-fit-vrl-vlr-016</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'float' and 'shrink-to-fit' logical width (16 sub-tests) + <ul class="assert"> + <li>This test checks that 'shrink-to-fit' rule (CSS2.1, &sect;10.3.5) is applied onto logical width in vertical writing-modes. This test thoroughly checks systematically the 16 combinations of 'writing-mode: vertical-rl', 'writing-mode: vertical-lr', with 'float: left', with 'float: right' and with left and/or right border(s). Not tested here is 'padding-left' and 'padding-right'.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-003-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-003.xht">float-vlr-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-right side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-005-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-005.xht">float-vlr-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-right side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-007-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-007.xht">float-vlr-007</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-left side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-009-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-009.xht">float-vlr-009</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-left side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-011-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-011.xht">float-vlr-011</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be respectively floated at the line-left side of its line box and floated at line-right of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vlr-013-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vlr-013.xht">float-vlr-013</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be respectively floated at the line-left side of its line box and floated at line-right of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-002-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-002.xht">float-vrl-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-right side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-004.xht">float-vrl-004</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: right' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-right side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-006-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-006.xht">float-vrl-006</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-left side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-008-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-008.xht">float-vrl-008</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-left side of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-010-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-010.xht">float-vrl-010</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be respectively floated at the line-left side of its line box and floated at line-right of its line box.</li> + </ul> + </td> + </tr> + <tr id="float-vrl-012-7.1" class="primary ahem image"> + <td><strong> + <a href="float-vrl-012.xht">float-vrl-012</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic) + <ul class="assert"> + <li>This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be respectively floated at the line-left side of its line box and floated at line-right of its line box.</li> + </ul> + </td> + </tr> + <tr id="horizontal-rule-vlr-003-7.1" class="primary image"> + <td><strong> + <a href="horizontal-rule-vlr-003.xht">horizontal-rule-vlr-003</a></strong></td> + <td><a href="reference/horizontal-rule-vlr-003-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>horizontal rule - 'vertical-lr' and orthogonal flow + <ul class="assert"> + <li>This test checks that an horizontal rule (<hr> element) in 'vertical-lr' writing-mode must be rendered as a vertical rule.</li> + </ul> + </td> + </tr> + <tr id="horizontal-rule-vlr-005-7.1" class="primary"> + <td><strong> + <a href="horizontal-rule-vlr-005.xht">horizontal-rule-vlr-005</a></strong></td> + <td><a href="reference/horizontal-rule-vrl-004-ref.xht">=</a> </td> + <td></td> + <td>horizontal rule - 'vertical-lr' + <ul class="assert"> + <li>This test checks that an horizontal rule (<hr> element) with 'vertical-lr' writing-mode but inside an 'horizontal-tb' writing-mode context must be rendered as an horizontal rule.</li> + </ul> + </td> + </tr> + <tr id="horizontal-rule-vrl-002-7.1" class="primary image"> + <td><strong> + <a href="horizontal-rule-vrl-002.xht">horizontal-rule-vrl-002</a></strong></td> + <td><a href="reference/horizontal-rule-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>horizontal rule - 'vertical-rl' and orthogonal flow + <ul class="assert"> + <li>This test checks that an horizontal rule (<hr> element) in 'vertical-rl' writing-mode must be rendered as a vertical rule.</li> + </ul> + </td> + </tr> + <tr id="horizontal-rule-vrl-004-7.1" class="primary"> + <td><strong> + <a href="horizontal-rule-vrl-004.xht">horizontal-rule-vrl-004</a></strong></td> + <td><a href="reference/horizontal-rule-vrl-004-ref.xht">=</a> </td> + <td></td> + <td>horizontal rule - 'vertical-rl' + <ul class="assert"> + <li>This test checks that an horizontal rule (<hr> element) with 'vertical-rl' writing-mode but inside an 'horizontal-tb' writing-mode context must be rendered as an horizontal rule.</li> + </ul> + </td> + </tr> + <tr id="margin-vlr-003-7.1" class="primary image"> + <td><strong> + <a href="margin-vlr-003.xht">margin-vlr-003</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin in 'vertical-lr' writing-mode context + <ul class="assert"> + <li>This test checks that margin-left, margin-right, margin-top and margin-bottom do not change in vertical writing-mode. The margin-left property of a box still affects the lefthand margin of such box.</li> + </ul> + </td> + </tr> + <tr id="margin-vrl-002-7.1" class="primary image"> + <td><strong> + <a href="margin-vrl-002.xht">margin-vrl-002</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin in 'vertical-rl' writing-mode context + <ul class="assert"> + <li>This test checks that margin-left, margin-right, margin-top and margin-bottom do not change in vertical writing-mode. The margin-left property of a box still affects the lefthand margin of such box.</li> + </ul> + </td> + </tr> + <tr id="padding-vlr-005-7.1" class="primary image"> + <td><strong> + <a href="padding-vlr-005.xht">padding-vlr-005</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding in 'vertical-lr' writing-mode context + <ul class="assert"> + <li>This test checks that padding-left, padding-right, padding-top and padding-bottom do not change in vertical writing-mode. The padding-left property of a box still affects the lefthand padding of such box.</li> + </ul> + </td> + </tr> + <tr id="padding-vrl-004-7.1" class="primary image"> + <td><strong> + <a href="padding-vrl-004.xht">padding-vrl-004</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding in 'vertical-rl' writing-mode context + <ul class="assert"> + <li>This test checks that padding-left, padding-right, padding-top and padding-bottom do not change in vertical writing-mode. The padding-left property of a box still affects the lefthand padding of such box.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-002-7.1" class="ahem"> + <td> + <a href="table-column-order-002.xht">table-column-order-002</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-rl + <ul class="assert"> + <li>This test checks that a table with 'writing-mode' set to 'vertical-rl' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-003-7.1" class="ahem"> + <td> + <a href="table-column-order-003.xht">table-column-order-003</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-lr + <ul class="assert"> + <li>This test checks that a table with 'writing-mode' set to 'vertical-lr' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-004-7.1" class="ahem"> + <td> + <a href="table-column-order-004.xht">table-column-order-004</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-rl + <ul class="assert"> + <li>This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction.</li> + </ul> + </td> + </tr> + <tr id="table-column-order-005-7.1" class="ahem"> + <td> + <a href="table-column-order-005.xht">table-column-order-005</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>'direction: rtl' - table columns order and vertical-lr + <ul class="assert"> + <li>This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction.</li> + </ul> + </td> + </tr> + <tr id="text-align-vlr-003-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-003.xht">text-align-vlr-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-lr' and 'direction: ltr' + </td> + </tr> + <tr id="text-align-vlr-005-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-005.xht">text-align-vlr-005</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-lr' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: left' aligns an inline box within a line box with respect to the line box's logical left side (line-left side). Here, 'direction: rtl' has no impact, no influence on such alignment.</li> + </ul> + </td> + </tr> + <tr id="text-align-vlr-007-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-007.xht">text-align-vlr-007</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-lr' and initial, default 'direction' + </td> + </tr> + <tr id="text-align-vlr-009-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-009.xht">text-align-vlr-009</a></strong></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-lr' and 'direction: ltr' + </td> + </tr> + <tr id="text-align-vlr-011-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-011.xht">text-align-vlr-011</a></strong></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-lr' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides).</li> + </ul> + </td> + </tr> + <tr id="text-align-vlr-013-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-013.xht">text-align-vlr-013</a></strong></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-lr' and initial, default 'direction' + </td> + </tr> + <tr id="text-align-vlr-015-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-015.xht">text-align-vlr-015</a></strong></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-lr' and 'direction: ltr' + </td> + </tr> + <tr id="text-align-vlr-017-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-017.xht">text-align-vlr-017</a></strong></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-lr' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: right' aligns an inline box within a line box with respect to the line box's logical right side (line-right side). Here, 'direction: rtl' has no impact, no influence on such alignment.</li> + </ul> + </td> + </tr> + <tr id="text-align-vlr-019-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vlr-019.xht">text-align-vlr-019</a></strong></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-lr' and initial, default 'direction' + <ul class="assert"> + <li>This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-002-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-002.xht">text-align-vrl-002</a></strong></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-rl' and 'direction: ltr' + <ul class="assert"> + <li>This test checks that 'text-align: left' aligns an inline box within a line box with respect to such line box's logical left side (line-left side).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-004-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-004.xht">text-align-vrl-004</a></strong></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-rl' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: left' aligns an inline box within a line box with respect to the line box's logical left side (line-left side). Here, 'direction: rtl' has no impact, no influence on such alignment.</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-006-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-006.xht">text-align-vrl-006</a></strong></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: left' - 'vertical-rl' and initial, default 'direction' + <ul class="assert"> + <li>This test checks that 'text-align: left' aligns an inline box within a line box with respect to such line box's logical left side (line-left side).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-008-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-008.xht">text-align-vrl-008</a></strong></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-rl' and 'direction: ltr' + <ul class="assert"> + <li>This test checks that 'text-align: center' centers an inline box within a line box with respect to such line box's logical left and right sides (line-left and line-right sides).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-010-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-010.xht">text-align-vrl-010</a></strong></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-rl' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-012-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-012.xht">text-align-vrl-012</a></strong></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: center' - 'vertical-rl' and initial, default 'direction' + <ul class="assert"> + <li>This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-014-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-014.xht">text-align-vrl-014</a></strong></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-rl' and 'direction: ltr' + <ul class="assert"> + <li>This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side).</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-016-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-016.xht">text-align-vrl-016</a></strong></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-rl' and 'direction: rtl' + <ul class="assert"> + <li>This test checks that 'text-align: right' aligns an inline box within a line box with respect to the line box's logical right side (line-right side). Here, 'direction: rtl' has no impact, no influence on such alignment.</li> + </ul> + </td> + </tr> + <tr id="text-align-vrl-018-7.1" class="primary ahem image"> + <td><strong> + <a href="text-align-vrl-018.xht">text-align-vrl-018</a></strong></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'text-align: right' - 'vertical-rl' and initial, default 'direction' + <ul class="assert"> + <li>This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side).</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s7.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#dimension-mapping">7.2 Dimensional Mapping</a></th></tr> + <!-- 12 tests --> + <tr id="border-spacing-vlr-003-7.2" class="primary ahem"> + <td><strong> + <a href="border-spacing-vlr-003.xht">border-spacing-vlr-003</a></strong></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>border-spacing - first value is specified and non-zero in 'vertical-lr' table + <ul class="assert"> + <li>This test checks that first value of 'border-spacing' represents, from top to bottom, a) spacing between logical table left padding (physical table top padding) and leftmost cells and b) inter-column spacing and c) spacing between rightmost cells and logical table right padding (physical table bottom padding).</li> + </ul> + </td> + </tr> + <tr id="border-spacing-vlr-005-7.2" class="primary ahem"> + <td><strong> + <a href="border-spacing-vlr-005.xht">border-spacing-vlr-005</a></strong></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>border-spacing - second value is specified and non-zero in 'vertical-lr' table + <ul class="assert"> + <li>This test checks that second value of 'border-spacing' represents, from left to right, a) spacing between logical table top padding (physical table left padding) and topmost cells and b) inter-row spacing and c) spacing between bottommost cells and logical table bottom padding (physical table right padding).</li> + </ul> + </td> + </tr> + <tr id="border-spacing-vrl-002-7.2" class="primary ahem"> + <td><strong> + <a href="border-spacing-vrl-002.xht">border-spacing-vrl-002</a></strong></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>border-spacing - first value is specified and non-zero in 'vertical-rl' table + <ul class="assert"> + <li>This test checks that first value of 'border-spacing' represents, from top to bottom, a) spacing between logical table right padding (physical table top padding) and rightmost cells and b) inter-column spacing and c) spacing between leftmost cells and logical table left padding (physical table bottom padding).</li> + </ul> + </td> + </tr> + <tr id="border-spacing-vrl-004-7.2" class="primary ahem"> + <td><strong> + <a href="border-spacing-vrl-004.xht">border-spacing-vrl-004</a></strong></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>border-spacing - second value is specified and non-zero in 'vertical-rl' table + <ul class="assert"> + <li>This test checks that second value of 'border-spacing' represents, from right to left, a) spacing between logical table top padding (physical table right padding) and topmost cells and b) inter-row spacing and c) between bottommost cells and logical table bottom padding (physical table left padding).</li> + </ul> + </td> + </tr> + <tr id="percent-margin-vlr-003-7.2" class="primary image"> + <td><strong> + <a href="percent-margin-vlr-003.xht">percent-margin-vlr-003</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin percentage and 'vertical-lr' + <ul class="assert"> + <li>This test checks that percentages on the margin are calculated with respect to the width of the containing block if the 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block.</li> + </ul> + </td> + </tr> + <tr id="percent-margin-vlr-005-7.2" class="primary image"> + <td><strong> + <a href="percent-margin-vlr-005.xht">percent-margin-vlr-005</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin percentage and 'vertical-lr' + <ul class="assert"> + <li>This test checks that percentages on the margin are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-lr'.</li> + </ul> + </td> + </tr> + <tr id="percent-margin-vrl-002-7.2" class="primary image"> + <td><strong> + <a href="percent-margin-vrl-002.xht">percent-margin-vrl-002</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin percentage and 'vertical-rl' + <ul class="assert"> + <li>This test checks that percentages on the margin are calculated with respect to the width of the containing block if 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block.</li> + </ul> + </td> + </tr> + <tr id="percent-margin-vrl-004-7.2" class="primary image"> + <td><strong> + <a href="percent-margin-vrl-004.xht">percent-margin-vrl-004</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>margin percentage and 'vertical-rl' + <ul class="assert"> + <li>This test checks that percentages on the margin are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-rl'.</li> + </ul> + </td> + </tr> + <tr id="percent-padding-vlr-003-7.2" class="primary image"> + <td><strong> + <a href="percent-padding-vlr-003.xht">percent-padding-vlr-003</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding percentage and 'vertical-lr' + <ul class="assert"> + <li>This test checks that percentages on the padding are calculated with respect to the width of the containing block if 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block.</li> + </ul> + </td> + </tr> + <tr id="percent-padding-vlr-005-7.2" class="primary image"> + <td><strong> + <a href="percent-padding-vlr-005.xht">percent-padding-vlr-005</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding percentage and 'vertical-lr' + <ul class="assert"> + <li>This test checks that percentages on the padding are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-lr'.</li> + </ul> + </td> + </tr> + <tr id="percent-padding-vrl-002-7.2" class="primary image"> + <td><strong> + <a href="percent-padding-vrl-002.xht">percent-padding-vrl-002</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding percentage and 'vertical-rl' + <ul class="assert"> + <li>This test checks that percentages on the padding are calculated with respect to the width of the containing block if the 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block.</li> + </ul> + </td> + </tr> + <tr id="percent-padding-vrl-004-7.2" class="primary image"> + <td><strong> + <a href="percent-padding-vrl-004.xht">percent-padding-vrl-004</a></strong></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>padding percentage and 'vertical-rl' + <ul class="assert"> + <li>This test checks that percentages on the padding are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-rl'.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s7.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#orthogonal-flows">7.3 Orthogonal Flows</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.3.#establish-an-orthogonal-flow-"> + <!-- 0 tests --> + </tbody> + <tbody id="s7.3.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.3.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto">7.3.1 Auto-sizing in Orthogonal Flows</a></th></tr> + <!-- 4 tests --> + <tr id="height-auto-non-replaced-block-vlr-003-7.3.1" class="primary scroll"> + <td><strong> + <a href="height-auto-non-replaced-block-vlr-003.xht">height-auto-non-replaced-block-vlr-003</a></strong></td> + <td></td> + <td><abbr class="scroll" title="Only valid for continuous media">Scroll</abbr></td> + <td>'height: auto' - non-replaced block in orthogonal flow ('vertical-lr') + <ul class="assert"> + <li>This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'.</li> + </ul> + </td> + </tr> + <tr id="height-auto-non-replaced-block-vlr-005-7.3.1" class="primary scroll"> + <td><strong> + <a href="height-auto-non-replaced-block-vlr-005.xht">height-auto-non-replaced-block-vlr-005</a></strong></td> + <td></td> + <td><abbr class="scroll" title="Only valid for continuous media">Scroll</abbr></td> + <td>'height: auto' - non-replaced block in orthogonal flow ('vertical-rl') + <ul class="assert"> + <li>This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'.</li> + </ul> + </td> + </tr> + <tr id="height-auto-non-replaced-block-vrl-002-7.3.1" class="primary scroll"> + <td><strong> + <a href="height-auto-non-replaced-block-vrl-002.xht">height-auto-non-replaced-block-vrl-002</a></strong></td> + <td></td> + <td><abbr class="scroll" title="Only valid for continuous media">Scroll</abbr></td> + <td>'height: auto' - non-replaced block in orthogonal flow ('vertical-rl') + <ul class="assert"> + <li>This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'.</li> + </ul> + </td> + </tr> + <tr id="height-auto-non-replaced-block-vrl-004-7.3.1" class="primary scroll"> + <td><strong> + <a href="height-auto-non-replaced-block-vrl-004.xht">height-auto-non-replaced-block-vrl-004</a></strong></td> + <td></td> + <td><abbr class="scroll" title="Only valid for continuous media">Scroll</abbr></td> + <td>'height: auto' - non-replaced block in orthogonal flow ('vertical-rl') + <ul class="assert"> + <li>This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s7.3.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.3.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#auto-multicol">7.3.2 Auto-sizing Block Containers in Orthogonal Flows</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.3.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.3.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#orthogonal-layout">7.3.3 Auto-sizing Orthogonal Flows</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.3.4"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.3.4">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#orthogonal-pagination">7.3.4 Fragmenting Orthogonal Flows</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.4"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.4">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout">7.4 Flow-Relative Mappings</a></th></tr> + <!-- 20 tests --> + <tr id="margin-collapse-vlr-003-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-003.xht">margin-collapse-vlr-003</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - maximum of 2 adjoining margins + <ul class="assert"> + <li>This test checks that margin-end and margin-start of adjacent blocks collapse into its maximum in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-009-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-009.xht">margin-collapse-vlr-009</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - adjoining margins of non-siblings or ancestors + <ul class="assert"> + <li>This test checks that adjoining margin-end and margin-start boxes generated by elements, that are not related by siblings or ancestors, collapse in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-011-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-011.xht">margin-collapse-vlr-011</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - floated elements do not collapse margins + <ul class="assert"> + <li>This test checks that margin-end of floated box does not collapse with the margin-start of a preceding block box in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-015-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-015.xht">margin-collapse-vlr-015</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - elements with 'overflow' set to 'visible' + <ul class="assert"> + <li>This test checks that elements with 'overflow' set to 'visible' collapse margin with in-flow children in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-017-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-017.xht">margin-collapse-vlr-017</a></strong></td> + <td><a href="reference/ref-if-there-is-no-red.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - elements with 'overflow' set to 'hidden' + <ul class="assert"> + <li>This test checks that elements with 'overflow' set to 'hidden' do not collapse margin with in-flow children in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-023-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-023.xht">margin-collapse-vlr-023</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-lr' and margin collapsing - absolute positioning and siblings + <ul class="assert"> + <li>This test checks that absolutely positioned boxes do not collapse margins with siblings in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-025-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-025.xht">margin-collapse-vlr-025</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - collapse through empty siblings + <ul class="assert"> + <li>This test checks that margins can collapse through empty elements in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-031-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-031.xht">margin-collapse-vlr-031</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - collapse through sibling + <ul class="assert"> + <li>This test checks that horizontal margins of boxes can collapse through a sibling box whose left and right margins collapse in 'vertical-lr' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-035-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-035.xht">margin-collapse-vlr-035</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - left margin of a block collapses with left margin of its first child + <ul class="assert"> + <li>This test checks that, in a vertical-lr context, the left margin an in-flow block element collapses with its first in-flow block-level child's left margin if the element has no top border, no top padding, and the child has no clearance.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vlr-037-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vlr-037.xht">margin-collapse-vlr-037</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-lr' and margin collapsing - right margin of a block collapses with right margin of its last child + <ul class="assert"> + <li>This test checks that, in a vertical-lr context, the right margin an in-flow block box collapses with its last in-flow block-level child's right margin if the element has no right padding and no right border and the child's right margin does not collapse with a left margin that has clearance.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-002-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-002.xht">margin-collapse-vrl-002</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - maximum of 2 adjoining margins + <ul class="assert"> + <li>This test checks that margin-end and margin-start of adjacent blocks collapse into its maximum in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-008-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-008.xht">margin-collapse-vrl-008</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - adjoining margins of non-siblings or ancestors + <ul class="assert"> + <li>This test checks that adjoining margin-end and margin-start boxes generated by elements, that are not related by siblings or ancestors, collapse in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-010-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-010.xht">margin-collapse-vrl-010</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - floated elements do not collapse margins + <ul class="assert"> + <li>This test checks that margin-start of floated box does not collapse with the margin-end of a preceding block box in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-014-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-014.xht">margin-collapse-vrl-014</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - elements with 'overflow' set to 'visible' + <ul class="assert"> + <li>This test checks that elements with 'overflow' set to 'visible' collapse margin with in-flow children in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-016-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-016.xht">margin-collapse-vrl-016</a></strong></td> + <td><a href="reference/ref-if-there-is-no-red.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - elements with 'overflow' set to 'hidden' + <ul class="assert"> + <li>This test checks that elements with 'overflow' set to 'hidden' do not collapse margin with in-flow children in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-022-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-022.xht">margin-collapse-vrl-022</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-rl' and margin collapsing - absolute positioning and siblings + <ul class="assert"> + <li>This test checks that absolutely positioned boxes do not collapse margins with siblings in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-024-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-024.xht">margin-collapse-vrl-024</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - collapse through empty siblings + <ul class="assert"> + <li>This test checks that margins can collapse through empty elements in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-030-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-030.xht">margin-collapse-vrl-030</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - collapse through sibling + <ul class="assert"> + <li>This test checks that horizontal margins of boxes can collapse through a sibling box whose left and right margins collapse in 'vertical-rl' writing-mode.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-034-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-034.xht">margin-collapse-vrl-034</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - right margin of a block collapses with right margin of its first child + <ul class="assert"> + <li>This test checks that, in a vertical-rl context, the right margin an in-flow block box collapses with its first in-flow block-level child's right margin if the element has no top border, no top padding, and the child has no clearance.</li> + </ul> + </td> + </tr> + <tr id="margin-collapse-vrl-036-7.4" class="primary ahem image"> + <td><strong> + <a href="margin-collapse-vrl-036.xht">margin-collapse-vrl-036</a></strong></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + <td>'vertical-rl' and margin collapsing - left margin of a block collapses with left margin of its last child + <ul class="assert"> + <li>This test checks that, in a vertical-rl context, the left margin an in-flow block box collapses with its last in-flow block-level child's left margin if the element has no left padding and no left border and the child's left margin does not collapse with a right margin that has clearance.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s7.5"> + <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> + <!-- 0 tests --> + </tbody> + <tbody id="s7.6"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.6">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#physical-only">7.6 Purely Physical Mappings</a></th></tr> + <!-- 16 tests --> + <tr id="background-position-vlr-003-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-003.xht">background-position-vlr-003</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left top' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-005-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-005.xht">background-position-vlr-005</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left bottom' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: left bottom' will make background-image start at lower right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-007-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-007.xht">background-position-vlr-007</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right top' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-009-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-009.xht">background-position-vlr-009</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right bottom' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-011-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-011.xht">background-position-vlr-011</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left top' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-013-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-013.xht">background-position-vlr-013</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left bottom' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-015-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-015.xht">background-position-vlr-015</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right top' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vlr-017-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vlr-017.xht">background-position-vlr-017</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right bottom' and 'vertical-lr' + <ul class="assert"> + <li>This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-002-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-002.xht">background-position-vrl-002</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left top' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-004-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-004.xht">background-position-vrl-004</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left bottom' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-006-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-006.xht">background-position-vrl-006</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right top' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is an horizontal resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-008-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-008.xht">background-position-vrl-008</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right bottom' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-010-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-010.xht">background-position-vrl-010</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left top' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: left top' will make background-image start at upper left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-012-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-012.xht">background-position-vrl-012</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: left bottom' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: left bottom' will make background-image start at lower left corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-014-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-014.xht">background-position-vrl-014</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right top' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: right top' will make background-image start at upper right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + <tr id="background-position-vrl-016-7.6" class="primary image interact"> + <td><strong> + <a href="background-position-vrl-016.xht">background-position-vrl-016</a></strong></td> + <td></td> + <td><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td> + <td>'background-position: right bottom' and 'vertical-rl' + <ul class="assert"> + <li>This test checks that 'background-position: right bottom' will make background-image start at lower right corner of page (even in case there is resizing of the window) because background properties should not be affected by vertical writing-mode.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s7.7"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s7.7">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#caption-side">7.7 Table Caption Mappings: the caption-side keywords</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s7.7.#valuedef-block-end"> + <!-- 0 tests --> + </tbody> + <tbody id="s7.7.#valuedef-block-start"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-8.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-8.xht new file mode 100644 index 00000000000..4818fc5fb6a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-8.xht @@ -0,0 +1,39 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Page Flow: the page progression direction - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Page Flow: the page progression direction (0 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s8"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s8">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#page-direction">8 Page Flow: the page progression direction</a></th></tr> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-9.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-9.xht new file mode 100644 index 00000000000..c434d28c2df --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-9.xht @@ -0,0 +1,514 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Glyph Composition - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Glyph Composition (26 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="s9"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine">9 Glyph Composition</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s9.#text-combine-horizontal"> + <!-- 2 tests --> + <tr id="text-combine-horizontal-010-9.#text-combine-horizontal" class="primary font"> + <td><strong> + <a href="text-combine-horizontal-010.xht">text-combine-horizontal-010</a></strong></td> + <td><a href="reference/text-combine-horizontal-010-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr></td> + <td>text-combine-horizontal - none + <ul class="assert"> + <li>This test verifies that 'text-combine-horizontal: none' does not combine multiple characters into the space of a single character i.e. characters from horizontal-only scripts are set sideways, i.e. 90&deg; clockwise from their standard orientation in horizontal text.</li> + </ul> + </td> + </tr> + <tr id="text-combine-horizontal-011-9.#text-combine-horizontal" class="primary font"> + <td><strong> + <a href="text-combine-horizontal-011.xht">text-combine-horizontal-011</a></strong></td> + <td><a href="reference/text-combine-horizontal-011-ref.xht">=</a> </td> + <td><abbr class="font" title="Requires a special font">Font</abbr></td> + <td>text-combine-horizontal - all + <ul class="assert"> + <li>This test verifies that 'text-combine-horizontal: all' display the text contents of the element horizontally within the vertical line box. i.e. characters from horizontal-only scripts are rendered upright.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s9.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright">9.1 Horizontal-in-Vertical Composition: the text-combine-upright property</a></th></tr> + <!-- 21 tests --> + <tr id="text-combine-upright-parsing-invalid-001-9.1" class="primary dom invalid script"> + <td><strong> + <a href="text-combine-upright-parsing-invalid-001.xht">text-combine-upright-parsing-invalid-001</a></strong></td> + <td></td> + <td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="invalid" title="Tests invalid CSS">Invalid</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td> + <td>CSS Writing Modes: parsing text-combine-upright with invalid values + <ul class="assert"> + <li>text-combine-upright doesn't support undefined keywords and out-of-range integer, and numbers.</li> + </ul> + </td> + </tr> + <tr id="text-combine-upright-parsing-invalid-002-9.1" class="primary dom invalid script"> + <td><strong> + <a href="text-combine-upright-parsing-invalid-002.xht">text-combine-upright-parsing-invalid-002</a></strong></td> + <td></td> + <td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="invalid" title="Tests invalid CSS">Invalid</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td> + <td>CSS Writing Modes: parsing text-combine-upright with digits plus calc() computing to invalid digits + <ul class="assert"> + <li>User Agents ignore text-combine-upright with values `digits calc(...)` if the expression inside `calc()` computes to either numbers or out-of-range integers.</li> + </ul> + </td> + </tr> + <tr id="text-combine-upright-parsing-valid-001-9.1" class="primary dom script"> + <td><strong> + <a href="text-combine-upright-parsing-valid-001.xht">text-combine-upright-parsing-valid-001</a></strong></td> + <td></td> + <td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td> + <td>CSS Writing Modes: parsing text-combine-upright with valid values + <ul class="assert"> + <li>text-combine-upright supports `none`, `all`, `digits`, and `digits` followed by a digit in the range from 2 to 4.</li> + </ul> + </td> + </tr> + <tr id="text-combine-upright-parsing-valid-002-9.1" class="primary dom script"> + <td><strong> + <a href="text-combine-upright-parsing-valid-002.xht">text-combine-upright-parsing-valid-002</a></strong></td> + <td></td> + <td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td> + <td>CSS Writing Modes: parsing text-combine-upright with digits plus calc() computing to valid digits + <ul class="assert"> + <li>User Agents support text-combine-upright with values `digits calc(...)` if the expression inside `calc()` computes to a valid integer, which is either 2, 3, or 4.</li> + </ul> + </td> + </tr> + <tr id="text-decoration-001-9.1" class="primary"> + <td><strong> + <a href="text-decoration-001.xht">text-decoration-001</a></strong></td> + <td><a href="reference/text-decoration-001-ref.xht">=</a> </td> + <td></td> + <td>text-combine-upright with text-decoration + <ul class="assert"> + <li>Test passes if text decoration applies to the composed character but each character inside tate-chu-yoko.</li> + </ul> + </td> + </tr> + <tr id="text-emphasis-001-9.1" class="primary"> + <td><strong> + <a href="text-emphasis-001.xht">text-emphasis-001</a></strong></td> + <td><a href="reference/text-emphasis-001-ref.xht">=</a> <a href="reference/reference/text-emphasis-001-notref.xht">≠</a> </td> + <td></td> + <td>text-combine-upright with text-emphasis + <ul class="assert"> + <li>Test passes if text emphasis applies to the composed character but each character inside tate-chu-yoko.</li> + </ul> + </td> + </tr> + <tr id="value-all-002-9.1" class="primary ahem"> + <td><strong> + <a href="value-all-002.xht">value-all-002</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: all + <ul class="assert"> + <li>'text-combine-upright: all' combines all characters inside the element which the declaration applied horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-all-003-9.1" class="primary ahem"> + <td><strong> + <a href="value-all-003.xht">value-all-003</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: all + <ul class="assert"> + <li>'text-combine-upright: all' combines all characters inside the element which the declaration applied horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-all-and-inherit-001-9.1" class="primary"> + <td><strong> + <a href="value-all-and-inherit-001.xht">value-all-and-inherit-001</a></strong></td> + <td><a href="reference/value-all-and-inherit-001-ref.xht">=</a> </td> + <td></td> + <td>text-combine-upright :all + <ul class="assert"> + <li>Two white triangles does not pointing to the right. Pointing up.</li> + </ul> + </td> + </tr> + <tr id="value-digit2-and-inherit-001-9.1" class="primary"> + <td><strong> + <a href="value-digit2-and-inherit-001.xht">value-digit2-and-inherit-001</a></strong></td> + <td><a href="reference/value-digit2-and-inherit-001-ref.xht">=</a> </td> + <td></td> + <td>text-combine-upright :digit2 + <ul class="assert"> + <li>Two white triangles does not pointing to the right. Pointing up.</li> + </ul> + </td> + </tr> + <tr id="value-digits2-002-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits2-002.xht">value-digits2-002</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 2 + two digits + <ul class="assert"> + <li>'text-combine-upright: digits 2' combines two ASCII digits horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-digits2-003-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits2-003.xht">value-digits2-003</a></strong></td> + <td><a href="reference/vertical-ahem-1x3-ref.xht">=</a> <a href="reference/horizontal-ahem-1x3-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 2 + three digits + <ul class="assert"> + <li>'text-combine-upright: digits 2' does not combine digits that are greater than two.</li> + </ul> + </td> + </tr> + <tr id="value-digits3-001-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits3-001.xht">value-digits3-001</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 3 + two digits + <ul class="assert"> + <li>'text-combine-upright: digits 3' combines two ASCII digits horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-digits3-002-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits3-002.xht">value-digits3-002</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 3 + three digits + <ul class="assert"> + <li>'text-combine-upright: digits 3' combines three ASCII digits horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-digits3-003-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits3-003.xht">value-digits3-003</a></strong></td> + <td><a href="reference/vertical-ahem-1x4-ref.xht">=</a> <a href="reference/horizontal-ahem-1x4-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 3 + four digits + <ul class="assert"> + <li>'text-combine-upright: digits 3' does not combine digits that are greater than three.</li> + </ul> + </td> + </tr> + <tr id="value-digits4-001-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits4-001.xht">value-digits4-001</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 4 + three digits + <ul class="assert"> + <li>'text-combine-upright: digits 4' combines three ASCII digits horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-digits4-002-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits4-002.xht">value-digits4-002</a></strong></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 4 + four digits + <ul class="assert"> + <li>'text-combine-upright: digits 4' combines four ASCII digits horizontally.</li> + </ul> + </td> + </tr> + <tr id="value-digits4-003-9.1" class="primary ahem"> + <td><strong> + <a href="value-digits4-003.xht">value-digits4-003</a></strong></td> + <td><a href="reference/vertical-ahem-1x5-ref.xht">=</a> <a href="reference/horizontal-ahem-1x5-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: digits 4 + five digits + <ul class="assert"> + <li>'text-combine-upright: digits 4' does not combine digits that are greater than four.</li> + </ul> + </td> + </tr> + <tr id="value-none-001-9.1" class="primary ahem"> + <td><strong> + <a href="value-none-001.xht">value-none-001</a></strong></td> + <td><a href="reference/vertical-ahem-1x3-ref.xht">=</a> <a href="reference/horizontal-ahem-1x3-notref.xht">≠</a> </td> + <td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + <td>CSS Writing Modes: text-combine-upright: none + <ul class="assert"> + <li>'text-combine-upright: none' does not combine any characters in any circumstance.</li> + </ul> + </td> + </tr> + <tr id="writing-mode-horizontal-001l-9.1" class="primary"> + <td><strong> + <a href="writing-mode-horizontal-001l.xht">writing-mode-horizontal-001l</a></strong></td> + <td><a href="reference/writing-mode-horizontal-001l-ref.xht">=</a> </td> + <td></td> + <td>CSS Writing Modes: text-combine-upright in horizontal writing mode + <ul class="assert"> + <li>text-combine-upright does not have an effect in horizontal writing modes.</li> + </ul> + </td> + </tr> + <tr id="writing-mode-horizontal-001r-9.1" class="primary"> + <td><strong> + <a href="writing-mode-horizontal-001r.xht">writing-mode-horizontal-001r</a></strong></td> + <td><a href="reference/writing-mode-horizontal-001r-ref.xht">=</a> </td> + <td></td> + <td>CSS Writing Modes: text-combine-upright in horizontal writing mode + <ul class="assert"> + <li>text-combine-upright does not have an effect in horizontal writing modes.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s9.1.#propdef-text-combine-upright"> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.#valuedef-all"> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.#valuedef-digits-integer"> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.#valuedef-none"> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9.1.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-runs">9.1.1 Text Run Rules</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.2"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9.1.2">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-layout">9.1.2 Layout Rules</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.3"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9.1.3">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-compression">9.1.3 Compression Rules</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="s9.1.3.1"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#s9.1.3.1">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-fullwidth">9.1.3.1 Full-width Characters</a></th></tr> + <!-- 3 tests --> + <tr id="full-width-001-9.1.3.1" class="primary"> + <td><strong> + <a href="full-width-001.xht">full-width-001</a></strong></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td></td> + <td>CSS Writing Modes: text-combine-upright on full-width characters + <ul class="assert"> + <li>When two or more full-width characters are combined, they are first converted to non-full-width characters.</li> + </ul> + </td> + </tr> + <tr id="full-width-002-9.1.3.1" class="primary"> + <td><strong> + <a href="full-width-002.xht">full-width-002</a></strong></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td></td> + <td>CSS Writing Modes: text-combine-upright on full-width characters + <ul class="assert"> + <li>When two or more full-width characters are combined, they are first converted to non-full-width characters.</li> + </ul> + </td> + </tr> + <tr id="full-width-003-9.1.3.1" class="primary"> + <td><strong> + <a href="full-width-003.xht">full-width-003</a></strong></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td></td> + <td>CSS Writing Modes: text-combine-upright on full-width characters + <ul class="assert"> + <li>When two or more full-width characters are combined, they are first converted to non-full-width characters.</li> + </ul> + </td> + </tr> + </tbody> + <tbody id="s.#abstract"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#acknowledgements"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#changes"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#changes-201109"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#changes-201205"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#changes-201211"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#changes-201311"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#conformance"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#conformance-classes"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#contents"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#conventions"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#cr-exit-criteria"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css2"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css21"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3-break"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3-flexbox"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3-sizing"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3-text-decor"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3bg"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3col"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3color"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3list"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3page"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#css3text"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#experimental"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#html401"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#html5"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#index"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#informative"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#normative"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#partial"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#property-index"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#references"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#rfc2119"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#rfc6919"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#status"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#subtitle"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#svg11"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#testing"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#title"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#uax11"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#uax24"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#uax29"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#uax44"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#uax9"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#unicode"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#utn22"> + <!-- 0 tests --> + </tbody> + <tbody id="s.#utr50"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-A.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-A.xht new file mode 100644 index 00000000000..aca8a71f1b3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-A.xht @@ -0,0 +1,45 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Characters and Properties - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Characters and Properties (0 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="sA"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#sA">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#character-properties">A Characters and Properties</a></th></tr> + <!-- 0 tests --> + </tbody> + <tbody id="sA.#character"> + <!-- 0 tests --> + </tbody> + <tbody id="sA.#grapheme-cluster"> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-B.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-B.xht new file mode 100644 index 00000000000..7fefb2ef453 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-B.xht @@ -0,0 +1,39 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Bidi Rules for HTML 4 - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Bidi Rules for HTML 4 (0 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="sB"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#sB">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#bidi-html">B Bidi Rules for HTML 4</a></th></tr> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-C.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-C.xht new file mode 100644 index 00000000000..723e8ca4a97 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/chapter-C.xht @@ -0,0 +1,39 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>Vertical Scripts in Unicode - CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite</h1> + <h2>Vertical Scripts in Unicode (0 tests)</h2> + <table width="100%"> + <col id="test-column"></col> + <col id="refs-column"></col> + <col id="flags-column"></col> + <col id="info-column"></col> + <thead> + <tr> + <th>Test</th> + <th><abbr title="Rendering References">Refs</abbr></th> + <th>Flags</th> + <th>Info</th> + </tr> + </thead> + <tbody id="sC"> + <tr><th colspan="4" scope="rowgroup"> + <a href="#sC">+</a> + <a href="http://www.w3.org/TR/css-writing-modes-3/#script-orientations">C Vertical Scripts in Unicode</a></th></tr> + <!-- 0 tests --> + </tbody> + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-002.xht new file mode 100644 index 00000000000..b36fbb6a125 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-002.xht @@ -0,0 +1,65 @@ +<!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: Clearance calculations - clearing box has larger margin than width of float</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/clearance-calculations-vrl-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that when a clearing element has a right margin (in a block formating context with 'writing-mode' set to 'vertical-rl') larger than the width of a floated element, then the right margin is collapsed with the margin-left of preceding in-flow sibling. The clearing element is then placed at the point of the resulting collapsed margin." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 5em; + } + + div#parent + { + background: red url("support/clearance-calculation-vrl-002.png"); + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + min-width: 6em; + writing-mode: vertical-rl; + } + + div > div + { + background-color: green; + width: 1em; + } + + div#preceding-sibling + { + margin-left: 1em; + } + + div#floated-left + { + float: left; + } + + div#clearing-left + { + clear: left; + margin-right: 4em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div id="parent"> + <div id="preceding-sibling"></div> + <div id="floated-left"></div> + <div id="clearing-left"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-004.xht new file mode 100644 index 00000000000..6b9697559df --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-004.xht @@ -0,0 +1,66 @@ +<!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: Clearance calculations - clearing box has narrower margin than clearance</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/clearance-calculations-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that if, after margin collapsing, the position of the clearing element is on the right of the float or would be hypothetically positioned within the layout position of the float, then the clearing element is positioned directly on the left of the floated element." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 5em; /* computes to 100px */ + } + + div#parent + { + background: red url("support/clearance-calculation-vrl-004.png"); + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + min-width: 8em; + writing-mode: vertical-rl; + } + + div > div + { + background-color: green; + width: 1em; + } + + div#preceding-sibling + { + margin-left: 4em; + } + + div#floated-left + { + float: left; + width: 2em; + } + + div#clearing-left + { + clear: left; + margin-right: 3em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div id="parent"> + <div id="preceding-sibling"></div> + <div id="floated-left"></div> + <div id="clearing-left"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-006.xht new file mode 100644 index 00000000000..cb6d86159dc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-006.xht @@ -0,0 +1,68 @@ +<!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: Clearance calculations - clearing box has larger margin than width of float</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/clearance-calculations-vrl-006-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that when a clearing element (in a block formating context with 'writing-mode' set to 'vertical-rl') has a right margin larger than the width of a floated element, then the right margin is collapsed with the margin-left of preceding in-flow sibling. The clearing element is then placed at the point of the resulting collapsed margin." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 5em; /* computes to 100px */ + } + + div#parent + { + background: red url("support/clearance-calculation-vrl-006.png"); + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + min-width: 7em; + writing-mode: vertical-rl; + } + + div > div + { + background-color: green; + width: 1em; + } + + div#preceding-sibling + { + margin-left: 1em; + } + + div#floated-left + { + float: left; + } + + div#clearing-left /* collapsing-through element */ + { + clear: left; + margin-left: 4em; + margin-right: 5em; + width: 0em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div id="parent"> + <div id="preceding-sibling"></div> + <div id="floated-left"></div> + <div id="clearing-left"></div> + <div id="following-sibling"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-008.xht new file mode 100644 index 00000000000..b34a50d6393 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/clearance-calculations-vrl-008.xht @@ -0,0 +1,70 @@ +<!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: clearance calculations</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/clearance-calculations-vrl-008-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="In this test, the right border edge of div#clearing-left must be on the left side of div#floated-left, i.e., 50px further on its left-hand side. That means that the margin-left of div#preceding-sibling must not collapse with the right margin of the div#clearing-left and clearance must be added such that clearance + margin-right of div#clearing-left = 50px, i.e., clearance = 50px - margin-right of div#clearing-left; therefore clearance is equal to 50px - 75px = - 25px." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + height: 116px; + writing-mode: vertical-rl; + } + + div#preceding-sibling + { + margin-left: 25px; + width: 25px; + } + + div#floated-left + { + float: left; + width: 50px; + } + + div#clearing-left + { + background-color: green; + clear: left; + margin-left: 8px; + margin-right: 75px; + width: 100px; + } + + div#reference-overlapped-red + { + background-color: red; + height: 100px; + position: absolute; + right: 108px; + top: 8px; + width: 100px; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <div id="preceding-sibling"></div> + + <div id="floated-left"></div> + + <div id="clearing-left"></div> + + <div><img src="support/pass-cdts-clearance-calculations.png" width="474" height="17" alt="Image download support must be enabled" /></div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap-reverse.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap-reverse.xht new file mode 100644 index 00000000000..d7b48698f3b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap-reverse.xht @@ -0,0 +1,55 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row-reverse wrap-reverse, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row-reverse wrap-reverse; + writing-mode: vertical-rl; + color: white; + + height: 9em; + } + .item { + background: green; + height: 3em; + width: 1.5em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">ｇｈｉ</div> + <div class="item">ｄｅｆ</div> + <div class="item">ａｂｃ</div> + <div class="item">７８９</div> + <div class="item">４５６</div> + <div class="item">１２３</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap.xht new file mode 100644 index 00000000000..a0938455bf9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse-wrap.xht @@ -0,0 +1,55 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row-reverse wrap, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row-reverse wrap; + writing-mode: vertical-rl; + color: white; + + height: 9em; + } + .item { + background: green; + height: 3em; + width: 1.5em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">７８９</div> + <div class="item">４５６</div> + <div class="item">１２３</div> + <div class="item">ｇｈｉ</div> + <div class="item">ｄｅｆ</div> + <div class="item">ａｂｃ</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse.xht new file mode 100644 index 00000000000..b4ca1c84a14 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-reverse.xht @@ -0,0 +1,50 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row-reverse, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row-reverse; + writing-mode: vertical-rl; + color: white; + } + .item { + background: green; + height: 3em; + width: 3em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">７８９<br />ｇｈｉ</div> + <div class="item">４５６<br />ｄｅｆ</div> + <div class="item">１２３<br />ａｂｃ</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap-reverse.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap-reverse.xht new file mode 100644 index 00000000000..36aee4caaf7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap-reverse.xht @@ -0,0 +1,55 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row wrap-reverse, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row wrap-reverse; + writing-mode: vertical-rl; + color: white; + + height: 9em; + } + .item { + background: green; + height: 3em; + width: 1.5em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">ａｂｃ</div> + <div class="item">ｄｅｆ</div> + <div class="item">ｇｈｉ</div> + <div class="item">１２３</div> + <div class="item">４５６</div> + <div class="item">７８９</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap.xht new file mode 100644 index 00000000000..49feeb202d0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row-wrap.xht @@ -0,0 +1,55 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row wrap, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row wrap; + writing-mode: vertical-rl; + color: white; + + height: 9em; + } + .item { + background: green; + height: 3em; + width: 1.5em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">１２３</div> + <div class="item">４５６</div> + <div class="item">７８９</div> + <div class="item">ａｂｃ</div> + <div class="item">ｄｅｆ</div> + <div class="item">ｇｈｉ</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row.xht new file mode 100644 index 00000000000..78073beae36 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/css-flexbox-row.xht @@ -0,0 +1,51 @@ +<!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 charset="utf-8" /> + <title>CSS Flexbox Test: flex direction: row, writing mode vertical</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <link href="http://fantasai.inkedblade.net/contact" rel="reviewer" title="Elika J Etemad" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/css-flexbox-row-ref.xht" rel="match" /> + <meta content="" name="flags" /> + <meta content="Test checks that when writing mode is vertical and flex-flow: row, the flex container is vertical." name="assert" /> + <style type="text/css"> + .container { + display: flex; + flex-flow: row; + writing-mode: vertical-rl; + color: white; + } + .item { + background: green; + height: 3em; + width: 3em; + + /* make sure UA that doesn't support writing mode and flexbox fails. */ + float: right; + } + .error { + position: absolute; + background: red; + height: 9em; + width: 3em; + z-index: -1; + } + </style> +</head> +<body> + + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="error"></div> + <div class="container"> + <div class="item">１２３<br />ａｂｃ</div> + <div class="item">４５６<br />ｄｅｆ</div> + <div class="item">７８９<br />ｇｈｉ</div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-001.xht new file mode 100644 index 00000000000..36ef111181d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-001.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: descendant inline with a different 'writing-mode' value</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="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="" name="flags" /> + <meta content="This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered." name="assert" /> + + <style type="text/css"><![CDATA[ + span#inner + { + background-color: green; + color: green; + height: 6.25em; + vertical-align: top; + width: 6.25em; + writing-mode: vertical-rl; + } + + div#reference-overlapped-red + { + background-color: red; + bottom: 6.25em; + height: 6.25em; + position: relative; + width: 6.25em; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="test-overlapping-green"> + <span id="outer"><span id="inner">I</span></span> + </div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-002.xht new file mode 100644 index 00000000000..0bc28175ff1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/different-block-flow-dir-002.xht @@ -0,0 +1,55 @@ +<!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: descendant inline with a different 'writing-mode' value</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="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="" name="flags" /> + <meta content="This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered." name="assert" /> + + <style type="text/css"><![CDATA[ + span#outer + { + vertical-align: top; + writing-mode: vertical-rl; + } + + span#inner + { + background-color: green; + color: green; + height: 6.25em; + vertical-align: top; + width: 6.25em; + writing-mode: horizontal-tb; + } + + div#reference-overlapped-red + { + background-color: red; + bottom: 6.25em; + height: 6.25em; + position: relative; + width: 6.25em; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="test-overlapping-green"> + <span id="outer"><span id="inner">I</span></span> + </div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-003.xht new file mode 100644 index 00000000000..69aafeaaa31 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-003.xht @@ -0,0 +1,50 @@ +<!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-lr' and 'direction: rtl'</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/#logical-directions" title="6.2 Flow-relative Directions" /> + <link rel="match" href="reference/direction-vlr-003-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that when a block box has 'direction' set to 'rtl' in a vertical writing-mode, then inlines boxes are aligned from line-right to line-left." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-bottom-200x300.png"); + direction: rtl; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-005.xht new file mode 100644 index 00000000000..23de83878e1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vlr-005.xht @@ -0,0 +1,50 @@ +<!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-lr' and 'direction: ltr'</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/#logical-directions" title="6.2 Flow-relative Directions" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="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." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-top-200x300.png"); + direction: ltr; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-002.xht new file mode 100644 index 00000000000..26a9e5c569c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-002.xht @@ -0,0 +1,50 @@ +<!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-rl' and 'direction: rtl'</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/#logical-directions" title="6.2 Flow-relative Directions" /> + <link rel="match" href="reference/direction-vrl-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that when a block box has 'direction' set to 'rtl' in a vertical writing-mode, then inlines boxes are aligned from line-right to line-left." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-bottom-200x300.png"); + direction: rtl; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-004.xht new file mode 100644 index 00000000000..75e743834ab --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/direction-vrl-004.xht @@ -0,0 +1,50 @@ +<!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-rl' and 'direction: ltr'</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/#logical-directions" title="6.2 Flow-relative Directions" /> + <link rel="match" href="reference/direction-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="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." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-top-200x300.png"); + direction: ltr; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/extract-ordered-list-direction-and-writing-modes.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/extract-ordered-list-direction-and-writing-modes.xht new file mode 100644 index 00000000000..355901aea76 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/extract-ordered-list-direction-and-writing-modes.xht @@ -0,0 +1,85 @@ +<!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 Test: flow-into on list items that use different text directions or writing modes</title> + <link href="mibalan@adobe.com" rel="author" title="Mihai Balan" /> + <link href="http://www.w3.org/TR/css3-regions/#properties" rel="help" /> + <link href="http://www.w3.org/TR/css3-regions/#the-flow-into-property" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#direction" rel="help" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" rel="help" /> + <meta content="" name="flags" /> + <meta content="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." name="assert" /> + <link href="reference/extract-ordered-list-direction-and-writing-modes-ref.xht" rel="match" /> + <style> + /*TODO: Include unprefixed and standard properties for writing modes and region breaking. */ + body>ol { + flow-into: f; + region-break-after: always; + break-after: region; + margin: 0; + } + .direction-rtl { + direction: rtl; + background-color: lightgray; + } + .writing-mode-vrl { + writing-mode: vertical-rl; + background-color: lightblue; + } + .writing-mode-vlr { + writing-mode: vertical-lr; + background-color: lightgreen; + } + .region { + flow-from: f; + border: thick solid black; + width: 15em; + height: 15em; + float: left; + margin: 0 1em; + } + </style> + </head> + <body> + <!-- Extracting lists with different directions and writing modes. --> + <p>Test pases if you see three rectangles with black borders containing a numbered list as described below. Each of the lists has a total of six items, three being in a nested list after the second item.</p> + <p>The first rectangle should display the numbered list on a light gray background. The list items should be right-aligned, with the numbers on the right side of the list item text. Also, the list item numbering should have a period prepended to the actual number (<em>e.g.</em> <strong>.1</strong>) instead of appended to the actual number (<em>e.g.</em> <strong>1.</strong>).</p> + <p>The second rectangle should display the numbered list on a light blue background. The text should be rotated 90 degrees clockwise with the list items progressing right to left (or top-to-bottom relative to the rotated list) this means the right-most list item should have the number 1.</p> + <p>The third rectangle should display the numbered list on a light green background. The text should be rotated 90 degrees clockwise, with the list items progressing left to right (or bottom-to-top relative to the rotated list) this means the right-most list item should have the number 3.</p> + <ol class="direction-rtl"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + <ol class="writing-mode-vrl"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + <ol class="writing-mode-vlr"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + <div class="region"></div> + <div class="region"></div> + <div class="region"></div> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-003.xht new file mode 100644 index 00000000000..3f5de3545e8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-003.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' and 'clear: right' in 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-gr-100x100.png"); + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-lr; + } + + div#floated-right + { + float: right; + } + + div#cleared-right + { + background-color: green; + clear: right; + width: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div> + <div id="cleared-right"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-005.xht new file mode 100644 index 00000000000..d0c25664ba2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-005.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'clear: left' in 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-gr-100x100.png"); + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-lr; + } + + div#floated-left + { + float: left; + } + + div#cleared-left + { + background-color: green; + clear: left; + width: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-left">L</div> + <div id="cleared-left"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-007.xht new file mode 100644 index 00000000000..8645c4c30d4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-007.xht @@ -0,0 +1,58 @@ +<!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: 'float: left' and 'clear: left' in 'vertical-lr' block formating context (intermediate)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-gr-100x100.png"); + font-size: 3.125em; /* computes to 50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-lr; + } + + div#container + { + border-right: green solid 1em; + width: auto; /* Very important: we want div#container to be able to shrink-wrap */ + } + + div.floated-left + { + float: left; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#clearing + { + clear: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="container"> + <div class="floated-left"></div> + <div class="floated-left"></div> + <div id="clearing"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-009.xht new file mode 100644 index 00000000000..70675177102 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vlr-009.xht @@ -0,0 +1,65 @@ +<!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: 'float: right', 'float: left' and 'clear: both' in 'vertical-lr' block formating context (intermediate)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-gr-100x100.png"); + font-size: 3.125em; /* computes to 50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-lr; + } + + div#container + { + border-right: green solid 1em; + width: auto; /* Very important: we want div#container to be able to shrink-wrap */ + } + + div#floated-left + { + float: left; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#floated-right + { + float: right; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#clearing + { + clear: both; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="container"> + <div id="floated-right"></div> + <div id="clearing"></div> + <div id="floated-left"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-002.xht new file mode 100644 index 00000000000..049acc40810 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-002.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' and 'clear: right' in 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-rg-100x100.png"); + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + div#floated-right + { + float: right; + } + + div#cleared-right + { + background-color: green; + clear: right; + width: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div> + <div id="cleared-right"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-004.xht new file mode 100644 index 00000000000..445ad477f3b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-004.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'clear: left' in 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-rg-100x100.png"); + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + div#floated-left + { + float: left; + } + + div#cleared-left + { + background-color: green; + clear: left; + width: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-left">L</div> + <div id="cleared-left"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-006.xht new file mode 100644 index 00000000000..07d34c6a211 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-006.xht @@ -0,0 +1,58 @@ +<!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: 'float: left' and 'clear: left' in 'vertical-rl' block formating context (intermediate)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-rg-100x100.png"); + font-size: 3.125em; /* computes to 50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + div#container + { + border-left: green solid 1em; + width: auto; /* Very important: we want div#container to be able to shrink-wrap */ + } + + div.floated-left + { + float: left; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#clearing + { + clear: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="container"> + <div class="floated-left"></div> + <div class="floated-left"></div> + <div id="clearing"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-008.xht new file mode 100644 index 00000000000..ab0104f1577 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-clear-vrl-008.xht @@ -0,0 +1,65 @@ +<!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: 'float: right', 'float: left' and 'clear: both' in 'vertical-rl' block formating context (intermediate)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that a block container box which has floats will not extend its logical height (it will appear to not be aware of its floats) unless it has a clearing block. This test is important for CSS columnar layout page based on floats." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-rg-100x100.png"); + font-size: 3.125em; /* computes to 50px */ + height: 2em; /* computes to 100px */ + width: 2em; /* computes to 100px */ + writing-mode: vertical-rl; + } + + div#container + { + border-left: green solid 1em; + width: auto; /* Very important: we want div#container to be able to shrink-wrap */ + } + + div#floated-left + { + float: left; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#floated-right + { + float: right; + height: 50%; /* computes to 50px */ + width: 1em; /* computes to 50px */ + } + + div#clearing + { + clear: both; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="container"> + <div id="floated-right"></div> + <div id="clearing"></div> + <div id="floated-left"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-003.xht new file mode 100644 index 00000000000..773e9aad165 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-003.xht @@ -0,0 +1,36 @@ +<!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: contiguous left-floating boxes in a 'vertical-lr' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 299px; + writing-mode: vertical-lr; + } + + img + { + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-005.xht new file mode 100644 index 00000000000..fe797a6d7f3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-005.xht @@ -0,0 +1,36 @@ +<!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: contiguous right-floating boxes in a 'vertical-lr' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 200px; + writing-mode: vertical-lr; + } + + img + { + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-007.xht new file mode 100644 index 00000000000..1ed7c5c1eee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-007.xht @@ -0,0 +1,40 @@ +<!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: contiguous left-floating boxes in a 'vertical-lr' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vlr-007-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div + { + height: 299px; + } + + img + { + float: left; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-009.xht new file mode 100644 index 00000000000..e1a87ee38c0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-009.xht @@ -0,0 +1,40 @@ +<!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: contiguous right-floating boxes in a 'vertical-lr' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vlr-009-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + div + { + height: 200px; + } + + div > img + { + float: right; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-011.xht new file mode 100644 index 00000000000..1876c923d9c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-011.xht @@ -0,0 +1,64 @@ +<!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: contiguous left-floating boxes with 'writing-mode' set to 'vertical-lr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks the flow of contiguous left-floated boxes with 'writing-mode' set to 'vertical-lr'." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div.floated-left + { + color: green; + float: left; + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + writing-mode: vertical-lr; + } + + div#reference-overlapped-red + { + background-color: red; + height: 100px; + left: 8px; + position: absolute; + top: 52px; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left">abcde</div> + + <div class="floated-left">fghjk</div> + + <div class="floated-left">lmnor</div> + + <div class="floated-left">rstuv</div> + + <div class="floated-left">wxyzz</div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-013.xht new file mode 100644 index 00000000000..6621104bfc9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vlr-013.xht @@ -0,0 +1,64 @@ +<!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: contiguous right-floating boxes with 'writing-mode' set to 'vertical-lr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vrl-012-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks the flow of contiguous right-floated boxes with 'writing-mode' set to 'vertical-lr'." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div.floated-right + { + color: green; + float: right; + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + writing-mode: vertical-lr; + } + + div#reference-overlapped-red + { + background-color: red; + height: 100px; + position: absolute; + right: 8px; + top: 52px; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-right">abcde</div> + + <div class="floated-right">fghjk</div> + + <div class="floated-right">lmnor</div> + + <div class="floated-right">rstuv</div> + + <div class="floated-right">wxyzz</div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-002.xht new file mode 100644 index 00000000000..b4d4b8c2049 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-002.xht @@ -0,0 +1,36 @@ +<!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: contiguous left-floating boxes in a 'vertical-rl' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 299px; + writing-mode: vertical-rl; + } + + img + { + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-004.xht new file mode 100644 index 00000000000..bb75daab91d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-004.xht @@ -0,0 +1,36 @@ +<!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: contiguous right-floating boxes in a 'vertical-rl' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes, otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 200px; + writing-mode: vertical-rl; + } + + img + { + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-006.xht new file mode 100644 index 00000000000..adb72a6c2ea --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-006.xht @@ -0,0 +1,40 @@ +<!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: contiguous left-floating boxes in a 'vertical-rl' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vrl-006-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous left-floating boxes. The later (in source document) left-floating box must be to the right of the right outer edge of earlier floating boxes otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div + { + height: 299px; + } + + img + { + float: left; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-008.xht new file mode 100644 index 00000000000..fb7c5d89151 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-008.xht @@ -0,0 +1,40 @@ +<!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: contiguous right-floating boxes in a 'vertical-rl' block formating context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vrl-008-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the flow of contiguous right-floating boxes. The later (in source document) right-floating box must be to the left of the left outer edge of earlier floating boxes, otherwise (if there is not enough available horizontal space) below the margin box of the earlier box." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + div + { + height: 200px; + } + + div > img + { + float: right; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div><img src="support/test-br.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tr.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-bl.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/test-tl.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-010.xht new file mode 100644 index 00000000000..184945e80fb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-010.xht @@ -0,0 +1,64 @@ +<!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: contiguous left-floating boxes with 'writing-mode' set to 'vertical-rl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks the flow of contiguous left-floated boxes with 'writing-mode' set to 'vertical-rl'." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div.floated-left + { + color: green; + float: left; + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + writing-mode: vertical-rl; + } + + div#reference-overlapped-red + { + background-color: red; + height: 100px; + left: 8px; + position: absolute; + top: 52px; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left">abcde</div> + + <div class="floated-left">fghjk</div> + + <div class="floated-left">lmnor</div> + + <div class="floated-left">rstuv</div> + + <div class="floated-left">wxyzz</div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-012.xht new file mode 100644 index 00000000000..3c4dedb36b8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-contiguous-vrl-012.xht @@ -0,0 +1,64 @@ +<!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: contiguous right-floating boxes with 'writing-mode' set to 'vertical-rl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/float-contiguous-vrl-012-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks the flow of contiguous right-floated boxes with 'writing-mode' set to 'vertical-rl'." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div.floated-right + { + color: green; + float: right; + font: 1.25em/1 Ahem; /* computes to 20px/20px */ + writing-mode: vertical-rl; + } + + div#reference-overlapped-red + { + background-color: red; + height: 100px; + position: absolute; + right: 8px; + top: 52px; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-right">abcde</div> + + <div class="floated-right">fghjk</div> + + <div class="floated-right">lmnor</div> + + <div class="floated-right">rstuv</div> + + <div class="floated-right">wxyzz</div> + + <div id="reference-overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-003.xht new file mode 100644 index 00000000000..e0950472ffb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-003.xht @@ -0,0 +1,51 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-lr' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-lr; + } + + div.left-border + { + border-left: red solid 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-005.xht new file mode 100644 index 00000000000..1ee0160df40 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-005.xht @@ -0,0 +1,56 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-lr' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-lr; + } + + div.left-border + { + border-left: red solid 1em; + } + + div.right-border + { + border-right: red solid 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border right-border"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-007.xht new file mode 100644 index 00000000000..72ec417a972 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-007.xht @@ -0,0 +1,66 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-lr' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-lr; + } + + div.left-border + { + border-left: red solid 1em; + } + + div.right-border + { + border-right: red solid 1em; + } + + div.left-padding + { + padding-left: 1em; + } + + div.right-padding + { + padding-right: 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border right-border left-padding right-padding"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-009.xht new file mode 100644 index 00000000000..7f43d2ba2d8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vlr-009.xht @@ -0,0 +1,56 @@ +<!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: 'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-lr' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' applying on logical width must not reduce content but size to fit to its content. In this test, 'L' and 'R' glyphs must be rendered." name="assert" /> + + <style type="text/css"><![CDATA[ + div#test-floated-left + { + color: green; + float: left; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: auto; + writing-mode: vertical-lr; + } + + div.inner-green-border-bottom + { + border-bottom: green solid 1em; + } + + div#reference-red-overlapped + { + background-color: red; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="test-floated-left"> + + <div class="inner-green-border-bottom">L</div> + + <div class="inner-green-border-bottom">R</div> + + </div> + + <div id="reference-red-overlapped"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-002.xht new file mode 100644 index 00000000000..6344bb3e012 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-002.xht @@ -0,0 +1,51 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-rl' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-rl; + } + + div.left-border + { + border-left: red solid 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-004.xht new file mode 100644 index 00000000000..16000684071 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-004.xht @@ -0,0 +1,56 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-rl' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-rl; + } + + div.left-border + { + border-left: red solid 1em; + } + + div.right-border + { + border-right: red solid 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border right-border"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-006.xht new file mode 100644 index 00000000000..b3a95297847 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-006.xht @@ -0,0 +1,66 @@ +<!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: 'float' and 'shrink-to-fit' logical width in 'vertical-rl' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' width is applied on logical width (measure)." name="assert" /> + + <style type="text/css"><![CDATA[ + div.floated-left + { + background-color: red; + float: left; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + writing-mode: vertical-rl; + } + + div.left-border + { + border-left: red solid 1em; + } + + div.right-border + { + border-right: red solid 1em; + } + + div.left-padding + { + padding-left: 1em; + } + + div.right-padding + { + padding-right: 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="floated-left"> + <div class="left-border right-border left-padding right-padding"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-008.xht new file mode 100644 index 00000000000..0434379fadf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-008.xht @@ -0,0 +1,56 @@ +<!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: 'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-rl' context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' applying on logical width must not reduce content but size to fit to its content. In this test, 'L' and 'R' glyphs must be rendered." name="assert" /> + + <style type="text/css"><![CDATA[ + div#test-floated-left + { + color: green; + float: left; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: auto; + writing-mode: vertical-rl; + } + + div.inner-green-border-bottom + { + border-bottom: green solid 1em; + } + + div#reference-red-overlapped + { + background-color: red; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="test-floated-left"> + + <div class="inner-green-border-bottom">L</div> + + <div class="inner-green-border-bottom">R</div> + + </div> + + <div id="reference-red-overlapped"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-vlr-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-vlr-016.xht new file mode 100644 index 00000000000..5a25df593ed --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-shrink-to-fit-vrl-vlr-016.xht @@ -0,0 +1,134 @@ +<!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: 'float' and 'shrink-to-fit' logical width (16 sub-tests)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that 'shrink-to-fit' rule (CSS2.1, §10.3.5) is applied onto logical width in vertical writing-modes. This test thoroughly checks systematically the 16 combinations of 'writing-mode: vertical-rl', 'writing-mode: vertical-lr', with 'float: left', with 'float: right' and with left and/or right border(s). Not tested here is 'padding-left' and 'padding-right'." name="assert" /> + + <style type="text/css"><![CDATA[ + div.test + { + background-color: red; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + } + + div.floated-right + { + float: right; + } + + div.floated-left + { + float: left; + } + + div.vrl + { + writing-mode: vertical-lr; + } + + div.vlr + { + writing-mode: vertical-lr; + } + + div.left-border + { + border-left: red solid 1em; + } + + div.right-border + { + border-right: red solid 1em; + } + + div#reference-overlapped-green + { + background-color: green; + height: 100px; + position: relative; + width: 100px; + z-index: -1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div class="test floated-right vlr"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-right vlr"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-right vrl"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-right vrl"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-right vlr"> + <div class="left-border"></div> + </div> + + <div class="test floated-right vlr"> + <div class="right-border"></div> + </div> + + <div class="test floated-right vrl"> + <div class="left-border"></div> + </div> + + <div class="test floated-right vrl"> + <div class="right-border"></div> + </div> + + <div class="test floated-left vlr"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-left vlr"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-left vrl"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-left vrl"> + <div class="left-border right-border"></div> + </div> + + <div class="test floated-left vlr"> + <div class="left-border"></div> + </div> + + <div class="test floated-left vlr"> + <div class="right-border"></div> + </div> + + <div class="test floated-left vrl"> + <div class="left-border"></div> + </div> + + <div class="test floated-left vrl"> + <div class="right-border"></div> + </div> + + <div id="reference-overlapped-green"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-003.xht new file mode 100644 index 00000000000..21365debdf7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-003.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-right side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-rg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-right + { + color: green; + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div>A + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-005.xht new file mode 100644 index 00000000000..a795692c124 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-005.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-right side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-rg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-right + { + color: green; + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper">A + <div id="floated-right">R</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-007.xht new file mode 100644 index 00000000000..5804d8c4cc1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-007.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-left side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-gg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper">A + <div id="floated-left">L</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-009.xht new file mode 100644 index 00000000000..58665512268 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-009.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-lr' will be floated at the line-left side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-rg-100x100.png") no-repeat; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-left + { + color: transparent; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-left">L</div>A + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-011.xht new file mode 100644 index 00000000000..425261f102a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-011.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be respectively floated at the line-left side of its line box and floated at line-right of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-rg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-right + { + color: green; + float: right; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div>A B <div id="floated-left">L</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-013.xht new file mode 100644 index 00000000000..96ae1cffac5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vlr-013.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-lr' will be respectively floated at the line-left side of its line box and floated at line-right of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-gr-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-lr; + } + + div#floated-right + { + color: green; + float: right; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + A <div id="floated-left">L</div> <div id="floated-right">R</div> B + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-002.xht new file mode 100644 index 00000000000..576bd8d7d00 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-002.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-right side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-gr-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-right + { + color: green; + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div>A + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-004.xht new file mode 100644 index 00000000000..1366ba4026f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-004.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: right' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-right side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-gr-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-right + { + color: green; + float: right; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper">A + <div id="floated-right">R</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-006.xht new file mode 100644 index 00000000000..bb1ef031ecf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-006.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-left side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-gg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper">A + <div id="floated-left">L</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-008.xht new file mode 100644 index 00000000000..12e6f5cc055 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-008.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box in a containing block with 'writing-mode' set to 'vertical-rl' will be floated at the line-left side of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gg-gr-100x100.png") no-repeat; + color: green; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-left + { + color: transparent; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-left">L</div>A + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-010.xht new file mode 100644 index 00000000000..b511dc9c7c3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-010.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be respectively floated at the line-left side of its line box and floated at line-right of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-rg-gr-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-right + { + color: green; + float: right; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="floated-right">R</div>A B <div id="floated-left">L</div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-012.xht new file mode 100644 index 00000000000..0bcd04b1aa6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/float-vrl-012.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic)</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that a floated left box and a floated right box in a containing block with 'writing-mode' set to 'vertical-rl' will be respectively floated at the line-left side of its line box and floated at line-right of its line box." name="assert" /> + + <style type="text/css"><![CDATA[ + div#wrapper + { + background: red url("support/pattern-gr-rg-100x100.png") no-repeat; + color: transparent; + font: 3.125em/1 Ahem; /* computes to 50px/50px */ + height: 100px; + width: 100px; + writing-mode: vertical-rl; + } + + div#floated-right + { + color: green; + float: right; + } + + div#floated-left + { + color: green; + float: left; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + A <div id="floated-left">L</div> <div id="floated-right">R</div> B + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-004.xht new file mode 100644 index 00000000000..0c16f3924a2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-004.xht @@ -0,0 +1,55 @@ +<!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: order, orientation and layout of form controls in 'vertical-rl' writing-mode</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="bookmark" type="image/png" href="http://www.w3.org/TR/css-writing-modes-3/vertical-form.png" title="Screenshot of vertical layout of form controls and characters" /> + <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" /> + + <meta content="image should" name="flags" /> + <meta content="This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1." name="assert" /> + + <style type="text/css"><![CDATA[ + form + { + font-size: 1.25em; + height: 13.5em; + margin-left: 0.7em; + writing-mode: vertical-rl; + } + + select { vertical-align: top; } + ]]></style> + </head> + + <body> + + <form action=""> + <p><label>姓名 <input value="艾俐俐" size="10" /></label></p> + + <p><label>语言 <select size="5"><option>English</option> + <option>français</option> + <option>فارسی</option> + <option>中文</option> + <option>日本語</option></select></label></p> + </form> + + <p>Test passes if the characters and form controls of the form above have the <strong>same order</strong>, the <strong>same orientation</strong> and the <strong>same layout</strong> as the ones of the form below:</p> + + <p><img src="support/vertical-form.png" width="182" height="266" alt="Image download support must be enabled" /> +<!-- + original source of the image is: + http://www.w3.org/TR/css-writing-modes-3/vertical-form.png + longdesc="Screenshot of vertical layout: the input element is laid lengthwise + from top to botom and its contents rendered in a vertical writing mode, + matching the lbels outside it. The drop-down selection control after it slides + out to the sid (towards the after edge of the block) rather than downward as + it would in hoizontal writing modes." +--> + </p> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-005.xht new file mode 100644 index 00000000000..7d3b44ae38e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/form-controls-vert-rl-005.xht @@ -0,0 +1,58 @@ +<!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: form controls in '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" /> + + <meta content="should" name="flags" /> + <meta content="This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'vertical-rl' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90° clockwise and c) the block flow direction must be from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + form + { + font-size: 1.25em; + height: auto; + writing-mode: vertical-rl; + } + + form > p { margin-right: 1em; } + ]]></style> + </head> + + <body> + + <p>Test passes if a) the form controls are appearing with Text sample1 on the left of the page and with Text sample10 on the right and if b) each of the 10 "Text sample" in the form controls are <strong>rotated 90° clockwise</strong>.</p> + + <form action=""> + + <p><button type="submit">Text sample10</button></p> + + <p><button type="button">Text sample9</button></p> + + <p><input type="reset" value="Text sample8" /></p> + + <p><input type="submit" value="Text sample7" /></p> + + <p><input type="button" value="Text sample6" /></p> + + <p><textarea cols="12" rows="2">Text sample5</textarea></p> + + <p> + <select size="3"> + <optgroup label="Text sample4"> + <option>Text sample3</option> + <option>Text sample2</option> + </optgroup> + </select> + </p> + + <p><input value="Text sample1" size="12" /></p> + </form> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-001.xht new file mode 100644 index 00000000000..dd832c91f65 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-001.xht @@ -0,0 +1,31 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright on full-width characters</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-fullwidth" rel="help" /> +<link href="reference/full-width-ref.xht" rel="match" /> +<link href="reference/full-width-notcu-notref.xht" rel="mismatch" /> +<link href="reference/full-width-horizontal-notref.xht" rel="mismatch" /> +<meta content="When two or more full-width characters are combined, they are first converted to non-full-width characters." name="assert" /> +<style> +.test { + writing-mode: vertical-rl; +} + +.tcy, .tcu-all { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div class="test"> + <p><span class="tcy">６</span>月<span class="tcy">１９</span>日</p> + <p>６月<span class="tcu-all">19</span>日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-002.xht new file mode 100644 index 00000000000..f4be71b9367 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-002.xht @@ -0,0 +1,36 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright on full-width characters</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-fullwidth" rel="help" /> +<link href="http://www.w3.org/TR/css-text-3/#full-width" rel="help" /> +<link href="reference/full-width-ref.xht" rel="match" /> +<link href="reference/full-width-notcu-notref.xht" rel="mismatch" /> +<link href="reference/full-width-horizontal-notref.xht" rel="mismatch" /> +<meta content="When two or more full-width characters are combined, they are first converted to non-full-width characters." name="assert" /> +<style> +.test { + writing-mode: vertical-rl; +} + +.tcy, .tcu-all { + text-combine-upright: all; +} + +.tcy { + text-transform: full-width; +} +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div class="test"> + <p><span class="tcy">6</span>月<span class="tcy">19</span>日</p> + <p>６月<span class="tcu-all">19</span>日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-003.xht new file mode 100644 index 00000000000..b94a835bde8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/full-width-003.xht @@ -0,0 +1,37 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright on full-width characters</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-fullwidth" rel="help" /> +<link href="http://www.w3.org/TR/css-text-3/#full-width" rel="help" /> +<link href="reference/full-width-ref.xht" rel="match" /> +<link href="reference/full-width-notcu-notref.xht" rel="mismatch" /> +<link href="reference/full-width-horizontal-notref.xht" rel="mismatch" /> +<meta content="When two or more full-width characters are combined, they are first converted to non-full-width characters." name="assert" /> +<style> +.test { + writing-mode: vertical-rl; +} +.tcy { + text-combine-upright: digits 2; + text-transform: full-width; +} + +.tcu-all { + text-combine-upright: all; +} + +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div class="test"> + <p><span class="tcy">6</span>月<span class="tcy">19</span>日</p> + <p>６月<span class="tcu-all">19</span>日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-003.xht new file mode 100644 index 00000000000..421ed01f5cf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-003.xht @@ -0,0 +1,36 @@ +<!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: 'height: auto' - non-replaced block in orthogonal flow ('vertical-lr')</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/#orthogonal-auto" title="7.3.1 Auto-sizing in Orthogonal Flows" /> + + <meta content="scroll" name="flags" /> + <meta content="This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: white; + height: auto; + writing-mode: vertical-lr; + } + + /* + 'height : auto' + must be solved as height of initial containing block which is the height of the viewport + */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a vertical scrollbar.</p> + + <div>A</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-005.xht new file mode 100644 index 00000000000..9ab90a215b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vlr-005.xht @@ -0,0 +1,47 @@ +<!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: 'height: auto' - non-replaced block in orthogonal flow ('vertical-rl')</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/#orthogonal-auto" title="7.3.1 Auto-sizing in Orthogonal Flows" /> + + <meta content="scroll" name="flags" /> + <meta content="This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + margin-bottom: 0px; + margin-top: 1px; + } + + div + { + color: white; + height: auto; + writing-mode: vertical-lr; + } + + /* + 'height : auto' + must be solved as height of initial containing block which is the height of the viewport + */ + + p + { + position: absolute; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a vertical scrollbar.</p> + + <div>x</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-002.xht new file mode 100644 index 00000000000..9b81ec84711 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-002.xht @@ -0,0 +1,36 @@ +<!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: 'height: auto' - non-replaced block in orthogonal flow ('vertical-rl')</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/#orthogonal-auto" title="7.3.1 Auto-sizing in Orthogonal Flows" /> + + <meta content="scroll" name="flags" /> + <meta content="This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: white; + height: auto; + writing-mode: vertical-rl; + } + + /* + 'height : auto' + must be solved as height of initial containing block which is the height of the viewport + */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a vertical scrollbar.</p> + + <div>A</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-004.xht new file mode 100644 index 00000000000..777c340f10a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/height-auto-non-replaced-block-vrl-004.xht @@ -0,0 +1,47 @@ +<!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: 'height: auto' - non-replaced block in orthogonal flow ('vertical-rl')</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/#orthogonal-auto" title="7.3.1 Auto-sizing in Orthogonal Flows" /> + + <meta content="scroll" name="flags" /> + <meta content="This test checks that the initial containing block's height (which is the size of viewport height) is used for determination of a block's measure (inline-size) in orthogonal flow when such measure is 'auto'." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + margin-bottom: 0px; + margin-top: 1px; + } + + div + { + color: white; + height: auto; + writing-mode: vertical-rl; + } + + /* + 'height : auto' + must be solved as height of initial containing block which is the height of the viewport + */ + + p + { + position: absolute; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a vertical scrollbar.</p> + + <div>x</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-003.xht new file mode 100644 index 00000000000..439a88a9dbf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-003.xht @@ -0,0 +1,57 @@ +<!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: horizontal rule - 'vertical-lr' and orthogonal flow</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/horizontal-rule-vlr-003-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that an horizontal rule (<hr> element) in 'vertical-lr' writing-mode must be rendered as a vertical rule." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + body + { + margin: 0px; + } + + hr + { + background-color: green; + border: transparent none 0px; + height: auto; + margin: 0px; + width: 10px; + } + + div#overlapped-red + { + background-color: red; + height: 100%; + position: relative; + right: 10px; + width: 10px; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-horiz-rule.png" width="260" height="36" alt="Image download support must be enabled" /></p> + + <hr /> + + <div id="overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-005.xht new file mode 100644 index 00000000000..ed02b3de11b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vlr-005.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: horizontal rule - 'vertical-lr'</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/horizontal-rule-vrl-004-ref.xht" /> + + <meta content="" name="flags" /> + <meta content="This test checks that an horizontal rule (<hr> element) with 'vertical-lr' writing-mode but inside an 'horizontal-tb' writing-mode context must be rendered as an horizontal rule." name="assert" /> + + <style type="text/css"><![CDATA[ + hr + { + background-color: green; + border: transparent none 0px; + height: 10px; + margin: 0px; + width: 100%; + writing-mode: vertical-lr; + } + + div#overlapped-red + { + background-color: red; + bottom: 10px; + height: 10px; + position: relative; + width: auto; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is an horizontal green bar and <strong>no red</strong>.</p> + + <hr /> + + <div id="overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-002.xht new file mode 100644 index 00000000000..51815c43766 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-002.xht @@ -0,0 +1,57 @@ +<!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: horizontal rule - 'vertical-rl' and orthogonal flow</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/horizontal-rule-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that an horizontal rule (<hr> element) in 'vertical-rl' writing-mode must be rendered as a vertical rule." name="assert" /> + + <style type="text/css"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + body + { + margin: 0px; + } + + hr + { + background-color: green; + border: transparent none 0px; + height: auto; + margin: 0px; + width: 10px; + } + + div#overlapped-red + { + background-color: red; + height: 100%; + left: 10px; + position: relative; + width: 10px; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <p><img src="support/pass-cdts-horiz-rule.png" width="260" height="36" alt="Image download support must be enabled" /></p> + + <hr /> + + <div id="overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-004.xht new file mode 100644 index 00000000000..6623f7d7781 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/horizontal-rule-vrl-004.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: horizontal rule - 'vertical-rl'</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> + <link rel="match" href="reference/horizontal-rule-vrl-004-ref.xht" /> + + <meta content="" name="flags" /> + <meta content="This test checks that an horizontal rule (<hr> element) with 'vertical-rl' writing-mode but inside an 'horizontal-tb' writing-mode context must be rendered as an horizontal rule." name="assert" /> + + <style type="text/css"><![CDATA[ + hr + { + background-color: green; + border: transparent none 0px; + height: 10px; + margin: 0px; + width: 100%; + writing-mode: vertical-rl; + } + + div#overlapped-red + { + background-color: red; + bottom: 10px; + height: 10px; + position: relative; + width: auto; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is an horizontal green bar and <strong>no red</strong>.</p> + + <hr /> + + <div id="overlapped-red"></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-001.xht new file mode 100644 index 00000000000..f2fd63c2542 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-001.xht @@ -0,0 +1,108 @@ +<!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 with content (alphabetical alignment with horizontal layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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-001-ref.xht" /> + <meta name="assert" content="This test checks the generation of inline-block baseline. When 'writing-mode' is horizontal, then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + div > p, div.control { + font-size: 2em; + background-color: orange; + } + img { + margin-left: -300px; + } + div.control > span { + background-color: yellow; + padding: 0em 1em; + } + div#control1 { + color: orange; + margin-top: 1em; + } + div#control1 > span { + color: yellow; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + padding-left: 1em; + padding-right: 1em; + } + span.descendant-block:first-child { + color: yellow; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' 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 class="control" id="control1">LLLL<span>LLLLL</span></div> + <div class="control" id="control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="horizontal-tb"> + <p class="mixed">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p> + <p class="upright">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p> + <p class="sideways-right">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p> + <p class="sideways-left">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p> + <p class="sideways">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></p> + <p class="use-glyph-orientation">LLLL<span class="inline-block"> + <span class="descendant-block">LLLLL</span> + <span class="descendant-block">LLLLL</span> + </span>LLLL<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 diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysleft.xht new file mode 100644 index 00000000000..fd501629044 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysleft.xht @@ -0,0 +1,72 @@ +<!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 with content (alphabetical alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + padding-top: 1em; + padding-bottom: 1em; + } + ]]></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>all 3 orange rectangles are <strong>identical</strong>.</li> + </ol> + + <div class="vertical-lr"> + <p class="sideways-left">LLLL<span class="inline-block"> + <span class="descendant-block">ABCD</span> + <span class="descendant-block">LLLL</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="sideways">LLLL<span class="inline-block"> + <span class="descendant-block">ABCD</span> + <span class="descendant-block">LLLL</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + <div class="vertical-rl"> + <p class="sideways-left">LLLL<span class="inline-block"> + <span class="descendant-block">LLLL</span> + <span class="descendant-block">ABCD</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysright.xht new file mode 100644 index 00000000000..c999cfe9045 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-002-sidewaysright.xht @@ -0,0 +1,72 @@ +<!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 with content (alphabetical alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + padding-top: 1em; + padding-bottom: 1em; + } + ]]></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>all 3 orange rectangles are <strong>identical</strong>.</li> + </ol> + + <div class="vertical-rl"> + <p class="sideways-right">LLLL<span class="inline-block"> + <span class="descendant-block">ABCD</span> + <span class="descendant-block">LLLL</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="sideways">LLLL<span class="inline-block"> + <span class="descendant-block">ABCD</span> + <span class="descendant-block">LLLL</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + <div class="vertical-lr"> + <p class="sideways-right">LLLL<span class="inline-block"> + <span class="descendant-block">LLLL</span> + <span class="descendant-block">ABCD</span> + </span>LLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-lr.xht new file mode 100644 index 00000000000..7deae06457e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-lr.xht @@ -0,0 +1,76 @@ +<!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 with content (central alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + } + + /* font */ + .half { + vertical-align: text-top; + font-size: 0.5em; + } + .right-side-of-central-baseline { + color: gold; + } + ]]></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>all 3 orange rectangles are <strong>identical</strong>.</li> + </ol> + + <div class="vertical-lr"> + <p class="mixed"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="upright"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="use-glyph-orientation"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-rl.xht new file mode 100644 index 00000000000..17c293579bf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-003-rl.xht @@ -0,0 +1,76 @@ +<!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 with content (central alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + } + + /* font */ + .half { + vertical-align: text-top; + font-size: 0.5em; + } + .right-side-of-central-baseline { + color: gold; + } + ]]></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>all 3 orange rectangles are <strong>identical</strong>.</li> + </ol> + + <div class="vertical-rl"> + <p class="mixed"><span class="half">OUTSIDe</span><span class="inline-block"> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="upright"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="use-glyph-orientation"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block right-side-of-central-baseline">RIGH</span> + <span class="descendant-block"><span class="half">LEFTLEFT</span></span> + </span><img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file 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 new file mode 100644 index 00000000000..a802d66934d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-004.xht @@ -0,0 +1,99 @@ +<!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> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <style type="text/css"><![CDATA[ + div > p, div.control { + font-size: 2em; + background-color: orange; + } + img { + margin-left: -300px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + + /* 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> + + <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 diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysleft.xht new file mode 100644 index 00000000000..eff928edf09 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysleft.xht @@ -0,0 +1,73 @@ +<!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 vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of empty inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + width: 1em; + background-color: yellow; + padding-top: 1em; + padding-bottom: 1em; + } + ]]></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 touching 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">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="sideways">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + <div class="vertical-rl"> + <p class="sideways-left">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysright.xht new file mode 100644 index 00000000000..40477549f68 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-005-sidewaysright.xht @@ -0,0 +1,73 @@ +<!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 vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of empty inline-block baseline. 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; + } + img { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + width: 1em; + background-color: yellow; + padding-top: 1em; + padding-bottom: 1em; + } + ]]></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 touching 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">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="sideways">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + <div class="vertical-lr"> + <p class="sideways-right">LLLLLLL<span class="inline-block"> + <span class="descendant-block"></span> + <span class="descendant-block"></span> + </span>LLLLLL<img src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-lr.xht new file mode 100644 index 00000000000..2f3d827064e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-lr.xht @@ -0,0 +1,72 @@ +<!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 (central alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of empty inline-block baseline. 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; + } + .baseline { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + } + + /* font */ + .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>all 3 orange rectangles are <strong>identical</strong>.</li> + </ol> + <div class="vertical-lr"> + <p class="mixed"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="upright"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="use-glyph-orientation"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-rl.xht new file mode 100644 index 00000000000..c65fe845428 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-block-alignment-006-rl.xht @@ -0,0 +1,73 @@ +<!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 (central alignment with vertical layout)</title> + <link rel="author" title="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <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" /> + <meta name="assert" content="This test checks the generation of empty inline-block baseline. 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; + } + .baseline { + margin-top: -300px; + } + + /* 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; + } + + /* inline-block */ + .inline-block { + display: inline-block; + } + .descendant-block { + display: block; + background-color: yellow; + } + + /* font */ + .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>all 2 orange rectangles are <strong>identical</strong>.</li> + </ol> + + <div class="vertical-rl"> + <p class="mixed"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="upright"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + <p class="use-glyph-orientation"><span class="half">OUTSIDE</span><span class="inline-block"> + <span class="descendant-block"><img src="support/opaque-square-40x160.png" alt="Image download support must be enabled" /></span> + <span class="descendant-block"><img src="support/right-side-filled-square-40x160.png" alt="Image download support must be enabled" /></span> + </span><img class="baseline" src="support/blue-vert-line-1x320.png" alt="Image download support must be enabled" /></p> + </div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-003.xht new file mode 100644 index 00000000000..d4a6ed979b1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-003.xht @@ -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 Writing Modes Test: inline replaced element and 'vertical-lr'</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="match" href="reference/inline-replaced-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that the content of an inline replaced element does not rotate due to the writing mode." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 7em; + writing-mode: vertical-lr; + } + + /* cat.png has an intrinsic height of 99px and an intrinsic width of 98px */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a cat and if the <strong>cat is not rotated</strong>.</p> + + <div><img src="support/cat.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-005.xht new file mode 100644 index 00000000000..5afc1badb40 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vlr-005.xht @@ -0,0 +1,34 @@ +<!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 replaced element and 'vertical-lr' (advanced)</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 2em; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div id="wrapper"> + <img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /><img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-002.xht new file mode 100644 index 00000000000..6a0bccf5ed4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-002.xht @@ -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 Writing Modes Test: inline replaced element and 'vertical-rl'</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="match" href="reference/inline-replaced-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that the content of an inline replaced element does not rotate due to the writing mode." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 7em; + writing-mode: vertical-rl; + } + + /* cat.png has an intrinsic height of 99px and an intrinsic width of 98px */ + ]]></style> + </head> + + <body> + + <p>Test passes if there is a cat and if the <strong>cat is not rotated</strong>.</p> + + <div><img src="support/cat.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-004.xht new file mode 100644 index 00000000000..e7f6852d7bb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/inline-replaced-vrl-004.xht @@ -0,0 +1,34 @@ +<!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 replaced element and 'vertical-rl' (advanced)</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/#replaced-baselines" title="4.3 Atomic Inline Baselines" /> + <link rel="match" href="reference/inline-replaced-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that, while the content of inline replaced elements do not rotate in vertical writing mode, they are nevertheless laid out from top to bottom (inline base direction) in a line box and their baseline-alignment is central (not alphabetic) and then the following lines boxes (line box direction within a block container) are ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 2em; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div> + <img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /><img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-001.xht new file mode 100644 index 00000000000..244072d973d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-001.xht @@ -0,0 +1,37 @@ +<!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: horizontal-tb - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes of a block box in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of the block box; they are ordered from top to bottom meaning that the 1st line box is the topmost one and then the 2nd block is juxtaposed to its bottom, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + width: 19em; /* Each line box has an inline-size of 19em */ + writing-mode: horizontal-tb; + } + ]]></style> + </head> + + <body> + + <div>AAAA BBBB CCCC DDDD E F G H J L M N Q R S T UUUU VVVV WWWW XXXX Z a b c d e f g h j k m n qqqq rrrr</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-002.xht new file mode 100644 index 00000000000..a9eeb6c31ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-002.xht @@ -0,0 +1,37 @@ +<!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-rl - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-003.xht new file mode 100644 index 00000000000..4a264060fb5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-003.xht @@ -0,0 +1,37 @@ +<!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-lr - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-005.xht new file mode 100644 index 00000000000..80429992316 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-005.xht @@ -0,0 +1,38 @@ +<!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: 'float: left' and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the line boxes of a left-floated box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + float: left; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-006.xht new file mode 100644 index 00000000000..ee03fcfe88f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-006.xht @@ -0,0 +1,65 @@ +<!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: 'float: left' and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the line boxes of left-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.floated-left + { + background-color: blue; + border-bottom: blue solid 1em; + border-left: blue solid 1em; + border-top: blue solid 1em; + float: left; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-rl; + } + + div#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + + <div class="floated-left"> + +<!-- The "P" --> eeee f g h j kkkkkkk + + </div> + + <div class="floated-left"> + +<!-- The "A" --> YYYYYYY Z a b c ddddddd + + </div> + + <div class="floated-left"> + +<!-- The left-most "S" --> L MMMM Q R S T U V WWWW X + + </div> + + <div class="floated-left" id="right-border"> + +<!-- The right-most "S" --> A BBBB C D E F G H JJJJ K + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-007.xht new file mode 100644 index 00000000000..62b575c419c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-007.xht @@ -0,0 +1,38 @@ +<!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: 'float: right' and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the line boxes of a right-floated box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + float: right; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-008.xht new file mode 100644 index 00000000000..fe4e61622ab --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-008.xht @@ -0,0 +1,64 @@ +<!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: 'float: right' and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-002-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the line boxes of right-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.floated-right + { + background-color: blue; + border-bottom: blue solid 1em; + border-right: blue solid 1em; + border-top: blue solid 1em; + float: right; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-lr; + } + + div#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div class="floated-right"> + +<!-- The right-most "S" --> aaaa b c d e f g h j kkkk + + </div> + + <div class="floated-right"> + +<!-- The left-most "S" --> NNNN Q R S T U V W X YYYY + + </div> + + <div class="floated-right"> + +<!-- The "A" --> GGGGGGG H J K L MMMMMMM + + </div> + + <div class="floated-right" id="left-border"> + +<!-- The "P" --> AAAAAAA B C D E FFFF + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-009.xht new file mode 100644 index 00000000000..ed60c4eee9c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-009.xht @@ -0,0 +1,39 @@ +<!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: position absolute and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + left: auto; + position: absolute; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-010.xht new file mode 100644 index 00000000000..fb868b46c77 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-010.xht @@ -0,0 +1,39 @@ +<!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: position absolute and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + left: auto; + position: absolute; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-011.xht new file mode 100644 index 00000000000..dffe63fc11a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-011.xht @@ -0,0 +1,66 @@ +<!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 and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-rl' are ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-right: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; /* Each line box has an inline-size of 8em */ + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-rl; + } + + span + { + border-left: blue solid 1em; + display: block; + } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The right-most "S" --> <span>A BBBB C D E F G H JJJJ K</span> + +<!-- The left-most "S" --> <span>L MMMM Q R S T U V WWWW X</span> + +<!-- The "A" --> <span>YYYYYYY Z a b c ddddddd</span> + +<!-- The "P" --> <span>eeee f g h j kkkkkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-012.xht new file mode 100644 index 00000000000..30897084a0f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-012.xht @@ -0,0 +1,94 @@ +<!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 and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-rl' are ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.inline-block + { + background-color: blue; + border-right: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-rl; + } + + span { display: block; } + + span#left-border { border-left: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div class="inline-block"> + +<!-- The right-most line of "P" --> <span>eeee </span> + +<!-- The 2nd right-most line of "P" --> <span>f g </span> + +<!-- The 3rd right-most line of "P" --> <span>h j </span> + +<!-- The 4th right-most line of "P" --> <span id="left-border">kkkkkkk</span> + + </div><div class="inline-block"> + +<!-- The right-most line of "A" --> <span>YYYYYYY</span> + +<!-- The 2nd right-most line of "A" --> <span>Z a </span> + +<!-- The 3rd right-most line of "A" --> <span>b c </span> + +<!-- The 4th right-most line of "A" --> <span>ddddddd</span> + + </div><div class="inline-block"> + +<!-- The right-most line of left-most "S" --> <span>L MMMM</span> + +<!-- The 2nd right-most line of left-most "S" --> <span>Q R S</span> + +<!-- The 3rd right-most line of left-most "S" --> <span>T U V</span> + +<!-- The 4th right-most line of left-most "S" --> <span>WWWW X</span> + + </div><div class="inline-block"> + +<!-- The right-most line of right-most "S" --> <span>A BBBB</span> + +<!-- The 2nd right-most line of right-most "S" --> <span>C D E</span> + +<!-- The 3rd right-most line of right-most "S" --> <span>F G H</span> + +<!-- The 4th right-most line of right-most "S" --> <span>JJJJ K</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-013.xht new file mode 100644 index 00000000000..013941a0d82 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-013.xht @@ -0,0 +1,59 @@ +<!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 and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-lr' are ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div#inline-block + { + background-color: blue; + border-right: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; /* Each line box has an inline-size of 8em */ + writing-mode: vertical-lr; + } + + span + { + border-left: blue solid 1em; + display: block; + } + ]]></style> + </head> + + <body> + + <div> + + <div id="inline-block"> + +<!-- The "P" --> <span>AAAAAAA B C D E FFFF </span> + +<!-- The "A" --> <span>GGGGGGG H J K L MMMMMMM</span> + +<!-- The left-most "S" --> <span>NNNN Q R S T U V W X YYYY</span> + +<!-- The right-most "S" --> <span>aaaa b c d e f g h j kkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-014.xht new file mode 100644 index 00000000000..32347d5f317 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-014.xht @@ -0,0 +1,94 @@ +<!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 and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-lr' are ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div.inline-block + { + background-color: blue; + border-left: blue solid 1em; + border-top: blue solid 1em; + display: inline-block; + height: 8em; + vertical-align: top; + /* + Why 'vertical-align: top' ? + See + http://lists.w3.org/Archives/Public/public-css-testsuite/2014Dec/0013.html + for explanations + */ + writing-mode: vertical-lr; + } + + span { display: block; } + + span#right-border { border-right: blue solid 1em; } + ]]></style> + </head> + + <body> + + <div> + + <div class="inline-block"> + +<!-- The 1st left-most line of "P" --> <span>AAAAAAA</span> + +<!-- The 2nd left-most line of "P" --> <span>B C </span> + +<!-- The 3rd left-most line of "P" --> <span>D E </span> + +<!-- The 4th left-most line of "P" --> <span>FFFF </span> + + </div><div class="inline-block"> + +<!-- The left-most line of "A" --> <span>GGGGGGG</span> + +<!-- The 2nd left-most line of "A" --> <span>H J </span> + +<!-- The 3rd left-most line of "A" --> <span>K L </span> + +<!-- The 4th left-most line of "A" --> <span>MMMMMMM</span> + + </div><div class="inline-block"> + +<!-- The 1st left-most line of left-most "S" --> <span>NNNN Q</span> + +<!-- The 2nd left-most line of left-most "S" --> <span>R S T</span> + +<!-- The 3rd left-most line of left-most "S" --> <span>U V W</span> + +<!-- The 4th left-most line of left-most "S" --> <span>X YYYY</span> + + </div><div class="inline-block"> + +<!-- The left-most line of right-most "S" --> <span>aaaa b</span> + +<!-- The 2nd left-most line of right-most "S" --> <span>c d e</span> + +<!-- The 3rd left-most line of right-most "S" --> <span>f g h</span> + +<!-- The 4th left-most line of right-most "S" --> <span id="right-border">j kkkk</span> + + </div> + + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-015.xht new file mode 100644 index 00000000000..0111e6110ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-015.xht @@ -0,0 +1,38 @@ +<!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: table-cell and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-rl' are ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + display: table-cell; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-016.xht new file mode 100644 index 00000000000..41f8cbf9eae --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-016.xht @@ -0,0 +1,38 @@ +<!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: table-cell and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-lr' are ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + display: table-cell; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-017.xht new file mode 100644 index 00000000000..fb42c02cb17 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-017.xht @@ -0,0 +1,38 @@ +<!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: table-caption and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-rl' are ordered from right to left." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + display: table-caption; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <div>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-018.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-018.xht new file mode 100644 index 00000000000..1c9ef3ba148 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-018.xht @@ -0,0 +1,38 @@ +<!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: table-caption and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-lr' are ordered from left to right." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + div + { + background-color: blue; + border: blue solid 1em; + display: table-caption; + height: 7em; /* Each line box has an inline-size of 7em */ + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <div>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-019.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-019.xht new file mode 100644 index 00000000000..d23ca941cec --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-019.xht @@ -0,0 +1,40 @@ +<!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: list and 'vertical-rl' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + ul + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + list-style: none outside none; + margin: 0em; + padding-top: 0em; /* overriding default padding-start: 40px in several browsers */ + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <ul><li>A BBBB C D E F G H JJJJ K L MMMM Q R S T U V WWWW X YYYYYYY Z a b c ddddddd eeee f g h j kkkkkkk</li></ul> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-020.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-020.xht new file mode 100644 index 00000000000..365ca5f8f9b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/line-box-direction-020.xht @@ -0,0 +1,40 @@ +<!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: list and 'vertical-lr' - ordering direction of line boxes</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc... " name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + ul + { + background-color: blue; + border: blue solid 1em; + height: 7em; /* Each line box has an inline-size of 7em */ + list-style: none outside none; + margin: 0em; + padding-top: 0em; /* overriding default padding-start: 40px in several browsers */ + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <ul><li>AAAAAAA B C D E FFFF GGGGGGG H J K L MMMMMMM NNNN Q R S T U V W X YYYY aaaa b c d e f g h j kkkk</li></ul> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/list-items-vert-rl-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/list-items-vert-rl-005.xht new file mode 100644 index 00000000000..a9d0839cc39 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/list-items-vert-rl-005.xht @@ -0,0 +1,66 @@ +<!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: order, orientation and layout of list items in a 'vertical-rl' writing-mode</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="bookmark" type="image/png" href="http://www.w3.org/TR/css-writing-modes-3/vertical-horizontal-list-markers.png" title="Screenshot of vertical layout of characters and list items" /> + <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" /> + + <meta content="image" name="flags" /> + <meta content="This test checks the order, the orientation and layout of list items when in a 'vertical-rl' writing mode as illustrated by and according to Example 5 of section 3.1." name="assert" /> + + <style type="text/css"><![CDATA[ + ol + { + height: 6em; + font-family: "Droid Serif", serif; + font-size: 1em; + line-height: 1; + margin-left: 0em; + margin-top: 2.5em; + padding-left: 0.5em; + padding-top: 0; + writing-mode: vertical-rl; + } + + li + { + margin-left: 0.25em; + margin-right: 0.25em; + } + + ::marker + { + color: blue; + vertical-align: text-top; + writing-mode: horizontal-tb; + } + ]]></style> + </head> + + <body> + + <ol> + <li>Item One</li> + + <li>Item Two</li> + + <li>Item Three</li> + </ol> + + <p>Test passes if the characters, list numbers and list items above have the <strong>same order</strong>, the <strong>same orientation</strong><!--, the <strong>same color</strong> --> and the <strong>same layout</strong> as the ones of the list below:</p> + + <p><img src="support/vertical-horizontal-list-markers.png" width="74" height="135" alt="Image download support must be enabled" /> + <!-- + original source of the image is: + http://www.w3.org/TR/css-writing-modes-3/vertical-horizontal-list-markers.png + longdesc="Diagram showing list markers of '1.', '2.', '3.' sitting + upright atop sideways vertical Latin list item text." + --> + </p> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-003.xht new file mode 100644 index 00000000000..5503b6a4f2b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-003.xht @@ -0,0 +1,67 @@ +<!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-lr' and margin collapsing - maximum of 2 adjoining margins</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-002.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margin-end and margin-start of adjacent blocks collapse into its maximum in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-lr; + } + + div#wrapper > div + { + background-color: green; + width: 1em; + } + + div#leftmost + { + margin-right: 2em; /* block-end margin of 1st block */ + } + + div#rightmost + { + margin-left: 1em; /* block-start margin of following block */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="leftmost"></div> + <div id="rightmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-009.xht new file mode 100644 index 00000000000..b86a44156f1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-009.xht @@ -0,0 +1,67 @@ +<!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-lr' and margin collapsing - adjoining margins of non-siblings or ancestors</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-005.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that adjoining margin-end and margin-start boxes generated by elements, that are not related by siblings or ancestors, collapse in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-lr; + } + + div#leftmost + { + background-color: green; + margin-right: 2em; /* block-end margin of sub-block of 1st block */ + width: 1em; + } + + div#rightmost + { + background-color: green; + margin-left: 1em; /* block-start margin of following sibling block */ + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div> + <div id="leftmost"></div> + </div> + <div id="rightmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-011.xht new file mode 100644 index 00000000000..f0f07cebaaf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-011.xht @@ -0,0 +1,68 @@ +<!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-lr' and margin collapsing - floated elements do not collapse margins</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-006.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margin-end of floated box does not collapse with the margin-start of a preceding block box in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-lr; + } + + div#wrapper > div + { + background-color: green; + width: 1em; + } + + div#leftmost + { + margin-right: 1em; /* block-end margin of 1st block */ + } + + div#rightmost + { + float: right; + margin-left: 1em; /* block-start margin of floated box */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="leftmost"></div> + <div id="rightmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-015.xht new file mode 100644 index 00000000000..6d3d0631343 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-015.xht @@ -0,0 +1,69 @@ +<!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-lr' and margin collapsing - elements with 'overflow' set to 'visible'</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-008.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that elements with 'overflow' set to 'visible' collapse margin with in-flow children in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: url("support/margin-collapse-2em-space-wm-vert.png") -1em top; + border-left: green solid 1em; + writing-mode: vertical-lr; + } + + div#wrapper div + { + width: 1em; + } + + div#overflow + { + margin-left: 2em; /* block-start margin of overflowed block */ + overflow: visible; + } + + div#nested + { + background-color: green; + margin-left: 2em; /* block-start margin of sub-block */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="overflow"> + <div id="nested"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-017.xht new file mode 100644 index 00000000000..c7fcf10d4ae --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-017.xht @@ -0,0 +1,65 @@ +<!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-lr' and margin collapsing - elements with 'overflow' set to 'hidden'</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-if-there-is-no-red.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-009.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that elements with 'overflow' set to 'hidden' do not collapse margin with in-flow children in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + writing-mode: vertical-lr; + width: 4em; + } + + div#overflow + { + margin-left: 2em; /* block-start margin of overflowed block */ + overflow: hidden; + width: 2em; + } + + div#nested + { + background-color: red; + margin-left: 2em; /* block-start margin of sub-block */ + width: 4em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="overflow"> + <div id="nested"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-023.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-023.xht new file mode 100644 index 00000000000..350a5f91bf2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-023.xht @@ -0,0 +1,99 @@ +<!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-lr' and margin collapsing - absolute positioning and siblings</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that absolutely positioned boxes do not collapse margins with siblings in 'vertical-lr' writing-mode." /> + + <!-- + left static position for the div#abs-pos could be determined with margin collapse + or without margin collapse; so there are 2 possible rendered layouts for such code + 2015-01-18 + + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-012.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <style type="text/css"><![CDATA[ + p + { + font: 1em/1.25 serif; /* computes to 16px/20px */ + } + + div#test + { + border: teal solid 1em; + font: 25px/1 Ahem; + height: 4em; /* computes to 100px */ + margin-bottom: 0.2em; /* computes to 5px */ + writing-mode: vertical-lr; + } + + div#wrapper + { + background-color: orange; + border-left: blue solid 1em; + width: 3em; + } + + div#wrapper > div + { + height: 4em; + margin-left: 1em; + } + + div#abs-pos + { + background-color: blue; + position: absolute; + top: 77px; + /* + 16px : p's margin-top + + 20px : p's line box height + + 16px : p's margin-bottom + + 25px : div#test's border-top + ========== + 77px + */ + width: 1em; + } + + div.ref + { + border: teal solid 1em; + font: 25px/1 Ahem; + height: 4em; /* computes to 100px */ + margin-bottom: 0.2em; + width: 4em; /* and not 100px + 8px for #ref1 */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the top square has a layout identical to one of the squares below it.</p> + + <div id="test"> + <div id="wrapper"> + <div id="widthless-static"></div> + <div id="abs-pos"></div> + </div> + </div> + + <div class="ref" id="ref1"><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><!-- width is intentionally not 33 --><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /></div> + + <div class="ref" id="ref2"><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-025.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-025.xht new file mode 100644 index 00000000000..53e860d1c58 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-025.xht @@ -0,0 +1,58 @@ +<!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-lr' and margin collapsing - collapse through empty siblings</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-016.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margins can collapse through empty elements in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background-image: url("support/margin-collapse-2em-space-wm-vert.png"); + background-position: -1em top; + border-left: green solid 1em; + border-right: green solid 1em; + writing-mode: vertical-lr; + } + + div.widthless + { + margin-right: 2em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div class="widthless"></div> + <div class="widthless"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-031.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-031.xht new file mode 100644 index 00000000000..eea368615b9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-031.xht @@ -0,0 +1,62 @@ +<!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-lr' and margin collapsing - collapse through sibling</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that horizontal margins of boxes can collapse through a sibling box whose left and right margins collapse in 'vertical-lr' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background-image: url("support/margin-collapse-2em-space-wm-vert.png"); + writing-mode: vertical-lr; + } + + div#left-most-sibling + { + background-color: green; + margin-right: 2em; + width: 1em; + } + + div#middle-sibling + { + margin-left: 2em; + margin-right: 2em; + } + + div#right-most-sibling + { + background-color: green; + margin-left: 2em; + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="left-most-sibling"></div> + <div id="middle-sibling"></div> + <div id="right-most-sibling"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-035.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-035.xht new file mode 100644 index 00000000000..36cbc3e5033 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-035.xht @@ -0,0 +1,65 @@ +<!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-lr' and margin collapsing - left margin of a block collapses with left margin of its first child</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-017.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that, in a vertical-lr context, the left margin an in-flow block element collapses with its first in-flow block-level child's left margin if the element has no top border, no top padding, and the child has no clearance." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png") -1em top; + border-left: green solid 1em; + width: 3em; + writing-mode: vertical-lr; + } + + div#parent + { + margin-left: 2em; /* block-start margin */ + } + + div#first-child + { + background-color: green; + margin-left: 2em; /* block-start margin of child */ + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="parent"> + <div id="first-child"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-037.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-037.xht new file mode 100644 index 00000000000..f553297dc15 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vlr-037.xht @@ -0,0 +1,69 @@ +<!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-lr' and margin collapsing - right margin of a block collapses with right margin of its last child</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that, in a vertical-lr context, the right margin an in-flow block box collapses with its last in-flow block-level child's right margin if the element has no right padding and no right border and the child's right margin does not collapse with a left margin that has clearance." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png") -1em top; + border-left: green solid 1em; + width: 3em; + writing-mode: vertical-lr; + } + + div#parent + { + background-color: green; + margin-right: 2em; /* block-end margin */ + } + + div#last-child + { + margin-right: 2em; /* block-end margin of last child */ + } + + div#following-parent + { + background-color: green; + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="parent"> + <div id="widthless-child"></div> + <div id="last-child"></div> + </div> + <div id="following-parent"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-002.xht new file mode 100644 index 00000000000..6c35659c14c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-002.xht @@ -0,0 +1,67 @@ +<!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-rl' and margin collapsing - maximum of 2 adjoining margins</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-002.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margin-end and margin-start of adjacent blocks collapse into its maximum in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-rl; + } + + div#wrapper > div + { + background-color: green; + width: 1em; + } + + div#rightmost + { + margin-left: 2em; /* block-end margin of 1st block */ + } + + div#leftmost + { + margin-right: 1em; /* block-start margin of following block */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="rightmost"></div> + <div id="leftmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-008.xht new file mode 100644 index 00000000000..570f6fe5c03 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-008.xht @@ -0,0 +1,67 @@ +<!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-rl' and margin collapsing - adjoining margins of non-siblings or ancestors</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-005.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that adjoining margin-end and margin-start boxes generated by elements, that are not related by siblings or ancestors, collapse in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-rl; + } + + div#rightmost + { + background-color: green; + margin-left: 2em; /* block-end margin of sub-block of 1st block */ + width: 1em; + } + + div#leftmost + { + background-color: green; + margin-right: 1em; /* block-start margin of following sibling block */ + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div> + <div id="rightmost"></div> + </div> + <div id="leftmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-010.xht new file mode 100644 index 00000000000..f3fc8fff1a8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-010.xht @@ -0,0 +1,68 @@ +<!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-rl' and margin collapsing - floated elements do not collapse margins</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-006.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margin-start of floated box does not collapse with the margin-end of a preceding block box in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + width: 4em; + writing-mode: vertical-rl; + } + + div#wrapper > div + { + background-color: green; + width: 1em; + } + + div#rightmost + { + margin-left: 1em; /* block-end margin of 1st block */ + } + + div#leftmost + { + float: left; + margin-right: 1em; /* block-start margin of floated box */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="rightmost"></div> + <div id="leftmost"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-014.xht new file mode 100644 index 00000000000..35063da1229 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-014.xht @@ -0,0 +1,69 @@ +<!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-rl' and margin collapsing - elements with 'overflow' set to 'visible'</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-008.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that elements with 'overflow' set to 'visible' collapse margin with in-flow children in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: url("support/margin-collapse-2em-space-wm-vert.png") left top; + border-right: green solid 1em; + writing-mode: vertical-rl; + } + + div#wrapper div + { + width: 1em; + } + + div#overflow + { + margin-right: 2em; /* block-start margin of overflowed block */ + overflow: visible; + } + + div#nested + { + background-color: green; + margin-right: 2em; /* block-start margin of sub-block */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="overflow"> + <div id="nested"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-016.xht new file mode 100644 index 00000000000..bf54b66673c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-016.xht @@ -0,0 +1,65 @@ +<!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-rl' and margin collapsing - elements with 'overflow' set to 'hidden'</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-if-there-is-no-red.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-009.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that elements with 'overflow' set to 'hidden' do not collapse margin with in-flow children in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + writing-mode: vertical-rl; + width: 4em; + } + + div#overflow + { + margin-right: 2em; /* block-start margin of overflowed block */ + overflow: hidden; + width: 2em; + } + + div#nested + { + background-color: red; + margin-right: 2em; /* block-start margin of sub-block */ + width: 4em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="overflow"> + <div id="nested"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-022.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-022.xht new file mode 100644 index 00000000000..e3403682ec1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-022.xht @@ -0,0 +1,101 @@ +<!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-rl' and margin collapsing - absolute positioning and siblings</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that absolutely positioned boxes do not collapse margins with siblings in 'vertical-rl' writing-mode." /> + + <!-- + left static position for the div#abs-pos could be determined with margin collapse + or without margin collapse; so there are 2 possible rendered layouts for such code + 2015-01-18 + + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-012.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <style type="text/css"><![CDATA[ + p + { + font: 1em/1.25 serif; /* computes to 16px/20px */ + } + + div#test + { + border: teal solid 1em; + font: 25px/1 Ahem; + height: 4em; /* computes to 100px */ + margin-bottom: 0.2em; /* computes to 5px */ + writing-mode: vertical-rl; + } + + div#wrapper + { + background-color: orange; + border-right: blue solid 1em; + width: 3em; + } + + div#wrapper > div + { + height: 4em; + margin-right: 1em; + } + + div#abs-pos + { + background-color: blue; + position: absolute; + top: 77px; + /* + 16px : p's margin-top + + 20px : p's line box height + + 16px : p's margin-bottom + + 25px : div#test's border-top + ========== + 77px + */ + width: 1em; + } + + + div.ref + { + border: teal solid 1em; + font: 25px/1 Ahem; + height: 4em; /* computes to 100px */ + margin-bottom: 0.2em; + width: 4em; /* and not 100px + 8px for #ref1 */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the top square has a layout identical to one of the squares below it.</p> + + <div id="test"> + <div id="wrapper"> + <div id="widthless-static"></div> + <div id="abs-pos"></div> + </div> + </div> + + + <div class="ref" id="ref1"><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><!-- width is intentionally not 33 --><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /></div> + + <div class="ref" id="ref2"><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-orange.png" width="25" height="100" alt="Image download support must be enabled" /><img src="support/swatch-blue.png" width="25" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-024.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-024.xht new file mode 100644 index 00000000000..9c4d7f0a355 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-024.xht @@ -0,0 +1,58 @@ +<!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-rl' and margin collapsing - collapse through empty siblings</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-016.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that margins can collapse through empty elements in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background-image: url("support/margin-collapse-2em-space-wm-vert.png"); + background-position: -1em top; + border-left: green solid 1em; + border-right: green solid 1em; + writing-mode: vertical-rl; + } + + div.widthless + { + margin-left: 2em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div class="widthless"></div> + <div class="widthless"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-030.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-030.xht new file mode 100644 index 00000000000..3c2d6e678dd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-030.xht @@ -0,0 +1,62 @@ +<!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-rl' and margin collapsing - collapse through sibling</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that horizontal margins of boxes can collapse through a sibling box whose left and right margins collapse in 'vertical-rl' writing-mode." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background-image: url("support/margin-collapse-2em-space-wm-vert.png"); + writing-mode: vertical-rl; + } + + div#right-most-sibling + { + background-color: green; + margin-left: 2em; + width: 1em; + } + + div#middle-sibling + { + margin-left: 2em; + margin-right: 2em; + } + + div#left-most-sibling + { + background-color: green; + margin-right: 2em; + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="right-most-sibling"></div> + <div id="middle-sibling"></div> + <div id="left-most-sibling"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-034.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-034.xht new file mode 100644 index 00000000000..cf20bb08efd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-034.xht @@ -0,0 +1,65 @@ +<!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-rl' and margin collapsing - right margin of a block collapses with right margin of its first child</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + Test adapted from + http://test.csswg.org/suites/css2.1/nightly-unstable/html4/margin-collapse-017.htm + + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that, in a vertical-rl context, the right margin an in-flow block box collapses with its first in-flow block-level child's right margin if the element has no top border, no top padding, and the child has no clearance." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + border-right: green solid 1em; + width: 3em; + writing-mode: vertical-rl; + } + + div#parent + { + margin-right: 2em; /* block-start margin */ + } + + div#first-child + { + background-color: green; + margin-right: 2em; /* block-start margin of child */ + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="parent"> + <div id="first-child"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-036.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-036.xht new file mode 100644 index 00000000000..ab956a0dbce --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-collapse-vrl-036.xht @@ -0,0 +1,69 @@ +<!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-rl' and margin collapsing - left margin of a block collapses with left margin of its last child</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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <!-- + " + The margin collapsing rules apply exactly with the block-start margin substituted for the top margin and the block-end margin substituted for the bottom margin. + " + --> + + <meta content="ahem image" name="flags" /> + <meta name="assert" content="This test checks that, in a vertical-rl context, the left margin an in-flow block box collapses with its last in-flow block-level child's left margin if the element has no left padding and no left border and the child's left margin does not collapse with a right margin that has clearance." /> + + <style type="text/css"><![CDATA[ + div + { + font: 25px/1em Ahem; + height: 4em; + } + + div#wrapper + { + background: red url("support/margin-collapse-2em-space-wm-vert.png"); + border-right: green solid 1em; + width: 3em; + writing-mode: vertical-rl; + } + + div#parent + { + background-color: green; + margin-left: 2em; /* block-end margin */ + } + + div#last-child + { + margin-left: 2em; /* block-end margin of last child */ + } + + div#following-parent + { + background-color: green; + width: 1em; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="wrapper"> + <div id="parent"> + <div id="widthless-child"></div> + <div id="last-child"></div> + </div> + <div id="following-parent"></div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vlr-003.xht new file mode 100644 index 00000000000..997ea486236 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vlr-003.xht @@ -0,0 +1,80 @@ +<!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: margin in 'vertical-lr' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that margin-left, margin-right, margin-top and margin-bottom do not change in vertical writing-mode. The margin-left property of a box still affects the lefthand margin of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 0.5em auto; + } + + .inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + .foo + { + margin-bottom: 5px; + margin-left: 100px; + margin-right: 50px; + margin-top: 20px; + writing-mode: vertical-lr; + } + + .bar + { + margin-bottom: 20px; + margin-left: 50px; + margin-right: 100px; + margin-top: 5px; + writing-mode: vertical-lr; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <hr /> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vrl-002.xht new file mode 100644 index 00000000000..6dcf446f87d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/margin-vrl-002.xht @@ -0,0 +1,80 @@ +<!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: margin in 'vertical-rl' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that margin-left, margin-right, margin-top and margin-bottom do not change in vertical writing-mode. The margin-left property of a box still affects the lefthand margin of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 0.5em auto; + } + + .inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + .foo + { + margin-bottom: 5px; + margin-left: 100px; + margin-right: 50px; + margin-top: 20px; + writing-mode: vertical-rl; + } + + .bar + { + margin-bottom: 20px; + margin-left: 50px; + margin-right: 100px; + margin-top: 5px; + writing-mode: vertical-rl; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <hr /> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vlr-005.xht new file mode 100644 index 00000000000..6cb07aa7db2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vlr-005.xht @@ -0,0 +1,78 @@ +<!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: padding in 'vertical-lr' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that padding-left, padding-right, padding-top and padding-bottom do not change in vertical writing-mode. The padding-left property of a box still affects the lefthand padding of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: blue; + border: transparent none 0px; + height: 9px; + margin: 0px; + } + + .inner + { + background-color: blue; + height: 50px; /* necessary, otherwise inner blocks will grow as tall as the height of viewport */ + } + + .foo + { + padding-bottom: 5px; + padding-left: 100px; + padding-right: 50px; + padding-top: 20px; + writing-mode: vertical-lr; + } + + .bar + { + padding-bottom: 20px; + padding-left: 50px; + padding-right: 100px; + padding-top: 5px; + writing-mode: vertical-lr; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vrl-004.xht new file mode 100644 index 00000000000..e1700ac5032 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/padding-vrl-004.xht @@ -0,0 +1,78 @@ +<!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: padding in 'vertical-rl' writing-mode context</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <!-- + Test inspired by + http://lxr.mozilla.org/mozilla-central/source/layout/reftests/writing-mode/1096224-1b.html + --> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that padding-left, padding-right, padding-top and padding-bottom do not change in vertical writing-mode. The padding-left property of a box still affects the lefthand padding of such box." name="assert" /> + + <style type="text/css"><![CDATA[ + .outer + { + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: blue; + border: transparent none 0px; + height: 9px; + margin: 0px; + } + + .inner + { + background-color: blue; + height: 50px; /* necessary, otherwise inner blocks must grow as tall as the height of viewport */ + } + + .foo + { + padding-bottom: 5px; + padding-left: 100px; + padding-right: 50px; + padding-top: 20px; + writing-mode: vertical-rl; + } + + .bar + { + padding-bottom: 20px; + padding-left: 50px; + padding-right: 100px; + padding-top: 5px; + writing-mode: vertical-rl; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-002.xht new file mode 100644 index 00000000000..90267cb0621 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-002.xht @@ -0,0 +1,39 @@ +<!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: 'writing-mode: vertical-rl' - default page flow (progression) direction</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" /> + + <meta content="image paged" name="flags" /> + <meta content="This test checks that 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." name="assert" /> + + <style type="text/css" media="print"><![CDATA[ + html + { + writing-mode: vertical-rl; + } + + body, div + { + width: 100%; + /* width: 100% will force a page-break in vertical-rl writing-mode */ + } + ]]></style> + </head> + + <body> + + <div><img src="support/page-flow-direction-002p1.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p2.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p3.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p4.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-003.xht new file mode 100644 index 00000000000..7bcf9e16e66 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/page-flow-direction-003.xht @@ -0,0 +1,39 @@ +<!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: 'writing-mode: vertical-lr' - default page flow (progression) direction</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" /> + + <meta content="image paged" name="flags" /> + <meta content="This test checks that 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." name="assert" /> + + <style type="text/css" media="print"><![CDATA[ + html + { + writing-mode: vertical-lr; + } + + body, div + { + width: 100%; + /* width: 100% will force a page-break in vertical-lr writing-mode */ + } + ]]></style> + </head> + + <body> + + <div><img src="support/page-flow-direction-002p1.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p2.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p3.png" alt="Image download support must be enabled" /></div> + + <div><img src="support/page-flow-direction-002p4.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-003.xht new file mode 100644 index 00000000000..1c0e09e32f1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-003.xht @@ -0,0 +1,76 @@ +<!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: margin percentage and 'vertical-lr'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the margin are calculated with respect to the width of the containing block if the 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 0.5em auto; + } + + div.inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + div.foo + { + margin-bottom: 2.5%; + margin-left: 50%; + margin-right: 25%; + margin-top: 10%; + writing-mode: vertical-lr; + } + + div.bar + { + margin-bottom: 10%; + margin-left: 25%; + margin-right: 50%; + margin-top: 2.5%; + writing-mode: vertical-lr; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <hr /> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-005.xht new file mode 100644 index 00000000000..1e641d4dfa8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vlr-005.xht @@ -0,0 +1,69 @@ +<!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: margin percentage and 'vertical-lr'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the margin are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-lr'." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border-top: blue solid 3px; + border-right: blue solid 3px; + border-bottom: blue solid 2px; + border-left: blue solid 3px; + height: 160px; + writing-mode: vertical-lr; + } + + div.inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + div.foo + { + margin-bottom: 0%; /* 0px */ + margin-left: 31.25%; /* 31.25% mult by 160px == 50px */ + margin-right: 0%; /* 0px */ + margin-top: 55.625%; /* 20px + 50px + 19px == 89px ; 89px divided by 160px == 55.625% */ + } + + div.bar + { + margin-bottom: 0%; /* 0px */ + margin-left: 0%; /* 0px */ + margin-right: 31.25%; /* 31.25% mult by 160px == 50px */ + margin-top: 12.5%; /* 12.5% mult by 160px == 20px */ + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-002.xht new file mode 100644 index 00000000000..cf0b3b00f63 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-002.xht @@ -0,0 +1,76 @@ +<!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: margin percentage and 'vertical-rl'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the margin are calculated with respect to the width of the containing block if 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 0.5em auto; + } + + div.inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + div.foo + { + margin-bottom: 2.5%; /* 5px */ + margin-left: 50%; /* 100px */ + margin-right: 25%; /* 50px */ + margin-top: 10%; /* 20px */ + writing-mode: vertical-rl; + } + + div.bar + { + margin-bottom: 10%; + margin-left: 25%; + margin-right: 50%; + margin-top: 2.5%; + writing-mode: vertical-rl; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <hr /> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-004.xht new file mode 100644 index 00000000000..815c7eb31c6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-margin-vrl-004.xht @@ -0,0 +1,69 @@ +<!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: margin percentage and 'vertical-rl'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the margin are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-rl'." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border-top: blue solid 3px; + border-right: blue solid 3px; + border-bottom: blue solid 2px; + border-left: blue solid 3px; + height: 160px; + writing-mode: vertical-rl; + } + + div.inner + { + background-color: yellow; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + width: 50px; + } + + div.foo + { + margin-bottom: 0%; /* 0px */ + margin-left: 0%; /* 0px */ + margin-right: 31.25%; /* 31.25% mult by 160px == 50px */ + margin-top: 12.5%; /* 12.5% mult by 160px == 20px */ + } + + div.bar + { + margin-bottom: 0%; /* 0px */ + margin-left: 31.25%; /* 31.25% mult by 160px == 50px */ + margin-right: 0%; /* 0px */ + margin-top: 55.625%; /* 20px + 50px + 19px == 89px ; 89px divided by 160px == 55.625% */ + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"></div> + <div class="inner bar"></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-003.xht new file mode 100644 index 00000000000..36d0ffe9db2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-003.xht @@ -0,0 +1,86 @@ +<!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: padding percentage and 'vertical-lr'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the padding are calculated with respect to the width of the containing block if 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 3px auto; + } + + div.inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + } + + img + { + vertical-align: bottom; + /* + Not necessary but because Chrome 40 does not centrally baseline-align + inline replaced element in vertical writing-mode with 'text-orientation: mixed' + or with 'text-orientation: upright', we do this to avoid a false negative. + */ + } + + + div.foo + { + padding-bottom: 2.5%; + padding-left: 50%; + padding-right: 25%; + padding-top: 10%; + writing-mode: vertical-lr; + } + + div.bar + { + padding-bottom: 10%; + padding-left: 25%; + padding-right: 50%; + padding-top: 2.5%; + writing-mode: vertical-lr; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-005.xht new file mode 100644 index 00000000000..ad91fbee418 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vlr-005.xht @@ -0,0 +1,78 @@ +<!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: padding percentage and 'vertical-lr'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the padding are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-lr'." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border-top: blue solid 3px; + border-right: blue solid 3px; + border-bottom: blue solid 2px; + border-left: blue solid 3px; + height: 160px; + writing-mode: vertical-lr; + } + + div.inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + } + + img + { + vertical-align: bottom; + /* + Not necessary but because Chrome 40 does not centrally baseline-align + inline replaced element in vertical writing-mode with 'text-orientation: mixed' + or with 'text-orientation: upright', we do this to avoid a false negative. + */ + } + + div.foo + { + padding-bottom: 0%; /* 0px */ + padding-left: 31.25%; /* 31.25% mult by 160px == 50px */ + padding-right: 0%; /* 0px */ + padding-top: 55.625%; /* 20px + 50px + 19px == 89px ; 89px divided by 160px == 55.625% */ + } + + div.bar + { + padding-bottom: 0%; /* 0px */ + padding-left: 0%; /* 0px */ + padding-right: 31.25%; /* 31.25% mult by 160px == 50px */ + padding-top: 12.5%; /* 12.5% mult by 160px == 20px */ + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-002.xht new file mode 100644 index 00000000000..6e4d5fe2afe --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-002.xht @@ -0,0 +1,85 @@ +<!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: padding percentage and 'vertical-rl'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the padding are calculated with respect to the width of the containing block if the 'writing-mode' of such containing block is 'horizontal-tb'. In this test, div.outer's computed 'writing-mode' value is 'horizontal-tb' and it is the div.inner's containing block." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border: blue solid 3px; + width: 200px; + } + + hr + { + background-color: transparent; + border: transparent none 0px; + height: 3px; + margin: 3px auto; + } + + div.inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + } + + img + { + vertical-align: bottom; + /* + Not necessary but because Chrome 40 does not centrally baseline-align + inline replaced element in vertical writing-mode with 'text-orientation: mixed' + or with 'text-orientation: upright', we do this to avoid a false negative. + */ + } + + div.foo + { + padding-bottom: 2.5%; /* 5px */ + padding-left: 50%; /* 100px */ + padding-right: 25%; /* 50px */ + padding-top: 10%; /* 20px */ + writing-mode: vertical-rl; + } + + div.bar + { + padding-bottom: 10%; + padding-left: 25%; + padding-right: 50%; + padding-top: 2.5%; + writing-mode: vertical-rl; + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <hr /> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-004.xht new file mode 100644 index 00000000000..1babf0d03f8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/percent-padding-vrl-004.xht @@ -0,0 +1,78 @@ +<!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: padding percentage and 'vertical-rl'</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/#dimension-mapping" title="7.2 Dimensional Mapping" /> + <link rel="match" href="reference/margin-vrl-002-ref.xht" /> + + <meta content="image" name="flags" /> + <meta content="This test checks that percentages on the padding are calculated with respect to the height of the containing block if the 'writing-mode' of such containing block is 'vertical-rl'." name="assert" /> + + <style type="text/css"><![CDATA[ + div.outer + { + background-color: blue; + border-top: blue solid 3px; + border-right: blue solid 3px; + border-bottom: blue solid 2px; + border-left: blue solid 3px; + height: 160px; + writing-mode: vertical-rl; + } + + div.inner + { + background-color: transparent; + height: 50px; /* necessary, otherwise div.inner blocks must grow as tall as the height of viewport */ + } + + img + { + vertical-align: bottom; + /* + Not necessary but because Chrome 40 does not centrally baseline-align + inline replaced element in vertical writing-mode with 'text-orientation: mixed' + or with 'text-orientation: upright', we do this to avoid a false negative. + */ + } + + div.foo + { + padding-bottom: 0%; /* 0px */ + padding-left: 0%; /* 0px */ + padding-right: 31.25%; /* 31.25% mult by 160px == 50px */ + padding-top: 12.5%; /* 12.5% mult by 160px == 20px */ + } + + div.bar + { + padding-bottom: 0%; /* 0px */ + padding-left: 31.25%; /* 31.25% mult by 160px == 50px */ + padding-right: 0%; /* 0px */ + padding-top: 55.625%; /* 20px + 50px + 19px == 89px ; 89px divided by 160px == 55.625% */ + } + + div#reference + { + margin-top: 1em; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div class="outer"> + <div class="inner foo"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + <div class="inner bar"><img src="support/swatch-yellow.png" width="50" height="50" alt="Image download support must be enabled" /></div> + </div> + + <div id="reference"><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-003-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-003-ref.xht new file mode 100644 index 00000000000..42ae156b601 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-003-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img#green-square + { + left: 80px; + position: relative; + top: 160px; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-007-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-007-ref.xht new file mode 100644 index 00000000000..7a9ce8faa53 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-007-ref.xht @@ -0,0 +1,37 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + div + { + margin-left: 0.5em; + } + + img + { + vertical-align: top; + } + + img#green-square + { + position: relative; + left: 96px; /* 80px + p's margin-left (1em) */ + top: 160px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-009-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-009-ref.xht new file mode 100644 index 00000000000..2dcb0626d6d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-009-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img#green-square + { + left: 80px; + position: relative; + top: 80px; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-013-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-013-ref.xht new file mode 100644 index 00000000000..bc3ed999d2b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vlr-013-ref.xht @@ -0,0 +1,37 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + div + { + margin-left: 0.5em; + } + + img + { + vertical-align: top; + } + + img#green-square + { + position: relative; + left: 96px; /* 80px + p's margin-left (1em) */ + top: 80px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-002-ref.xht new file mode 100644 index 00000000000..02602aff7e9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-002-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img#green-square + { + left: 160px; + position: relative; + top: 160px; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-004-ref.xht new file mode 100644 index 00000000000..e392156969a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-004-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img#green-square + { + left: 160px; + position: relative; + top: 80px; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p> + + <div><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-006-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-006-ref.xht new file mode 100644 index 00000000000..08e2d047f2a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-006-ref.xht @@ -0,0 +1,42 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + body + { + direction: rtl; + } + + div + { + margin-right: 0.5em; + } + + img + { + vertical-align: top; + } + + img#green-square + { + position: relative; + right: 96px; /* 80px + p's margin-left (1em) */ + top: 160px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-012-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-012-ref.xht new file mode 100644 index 00000000000..5f9a5a93b08 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/abs-pos-non-replaced-vrl-012-ref.xht @@ -0,0 +1,42 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + body + { + direction: rtl; + } + + div + { + margin-right: 0.5em; + } + + img + { + vertical-align: top; + } + + img#green-square + { + position: relative; + right: 96px; /* 80px + p's margin-left (1em) */ + top: 80px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /><img id="green-square" src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht new file mode 100644 index 00000000000..329a06adce5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht @@ -0,0 +1,25 @@ +<!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 Reftest Reference</title> + <link href="mailto:badea@adobe.com" rel="author" title="Catalin Badea" /> + <style> + .content { + font-family: Ahem; + line-height: 1em; + font-size: 20px; + color: green; + } + </style> + </head> + <body> + <ul> + <li>Test passes if you see a horizontal green stripe.</li> + <li>You shouldn't see any red.</li> + </ul> + <div class="content"> + XXXXX<br /> + XXXXX + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/baseline-inline-replaced-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/baseline-inline-replaced-002-ref.xht new file mode 100644 index 00000000000..dc5e8e3c65c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/baseline-inline-replaced-002-ref.xht @@ -0,0 +1,22 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-16 --> + + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + img + { + vertical-align: top; + } + ]]></style> + </head> + <body> + + <p>Test passes if there is a cat and <strong>no red</strong>.</p> + + <div><img id="cat" src="support/cat.png" width="98" height="99" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-001.xht new file mode 100644 index 00000000000..4a1278bd27d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi embed (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-002.xht new file mode 100644 index 00000000000..5b6bbc11c2c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi embed (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-003.xht new file mode 100644 index 00000000000..8b33eef8c42 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi embed (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-004.xht new file mode 100644 index 00000000000..7f2019893ea --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi embed (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-005.xht new file mode 100644 index 00000000000..2d53eda7fe4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi embed, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭d < b > c < a‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭d < b > c < a‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-006.xht new file mode 100644 index 00000000000..adeed924ce0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi embed, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ג < ב > ד‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ג < ב > ד‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-007.xht new file mode 100644 index 00000000000..538938b1fdb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-007.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭3 א‬</div> + + +<div class="ref" dir="ltr">‭3 א‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-008.xht new file mode 100644 index 00000000000..0f7587a89ae --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭a 3‬</div> + + +<div class="ref" dir="rtl">‭a 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-009.xht new file mode 100644 index 00000000000..049329cf697 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭a > b</div> + + +<div class="ref" dir="rtl">‭a > b</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-010.xht new file mode 100644 index 00000000000..1361e6fa82c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi embed, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭ב < א</div> + + +<div class="ref" dir="ltr">‭ב < א</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-011.xht new file mode 100644 index 00000000000..a3e2a318425 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-embed-011.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, unicode-bidi embed</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: embed; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a > ד < b > d >‬</div> + + +<div class="ref" dir="ltr">‭> a > ד < b > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-001.xht new file mode 100644 index 00000000000..c0e5c59c081 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + +<div class="ref" dir="ltr">‭> א < a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-002.xht new file mode 100644 index 00000000000..0504bd84bda --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi isolate (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + +<div class="ref" dir="ltr">‭> a < א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-003.xht new file mode 100644 index 00000000000..bdd9062440b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + +<div class="ref" dir="rtl">‭< א > a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-004.xht new file mode 100644 index 00000000000..4856264f5c4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi isolate (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + +<div class="ref" dir="rtl">‭< a > א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-005.xht new file mode 100644 index 00000000000..208e1eeb539 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi isolate, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-006.xht new file mode 100644 index 00000000000..5f7b7b51af2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi isolate, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-007.xht new file mode 100644 index 00000000000..11acaf31de2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-007.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref">‭א 3‬</div> + +<div class="ref">‭א 3‬</div> + + + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-008.xht new file mode 100644 index 00000000000..9654288e527 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭3 a‬</div> + + +<div class="ref" dir="rtl">‭3 a‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-009.xht new file mode 100644 index 00000000000..b202ad390d4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭b < a</div> + + +<div class="ref" dir="rtl">‭b < a</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-010.xht new file mode 100644 index 00000000000..d5a9508d4ee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭א > ב</div> + + +<div class="ref" dir="ltr">‭א > ב</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-001.xht new file mode 100644 index 00000000000..33b0011afff --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, isolate-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-002.xht new file mode 100644 index 00000000000..e9325afcdd7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, isolate-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-003.xht new file mode 100644 index 00000000000..7b9a7add920 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, isolate-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-004.xht new file mode 100644 index 00000000000..a9a6c72df35 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, isolate-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-005.xht new file mode 100644 index 00000000000..155f47b5079 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with isolate-override, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭a > ג < ב > d‬</div> + <div dir="rtl">‭a > c < b > d‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ג < ב > d‬</div> + <div dir="rtl">‭a > c < b > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-006.xht new file mode 100644 index 00000000000..f96034ea2ee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with isolate-override, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ב > ג < א‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ב > ג < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-007.xht new file mode 100644 index 00000000000..b95739044bf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-007.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭דגבא‬ 3</div> + + +<div class="ref" dir="ltr">‭דגבא‬ 3</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-008.xht new file mode 100644 index 00000000000..44f8cab7769 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭3 abcd‬</div> + + +<div class="ref" dir="rtl">‭3 abcd‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-009.xht new file mode 100644 index 00000000000..825f591d47c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭e < abcd</div> + + +<div class="ref" dir="rtl">‭e < abcd</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-010.xht new file mode 100644 index 00000000000..ee2f5a892b5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and isolate-override, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭דגבא > ה</div> + + +<div class="ref" dir="ltr">‭דגבא > ה</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-011.xht new file mode 100644 index 00000000000..c71c0a586ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-011.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, isolate-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-012.xht new file mode 100644 index 00000000000..d77477ec394 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-isolate-override-012.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: default direction, isolate-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-isolate-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-001.xht new file mode 100644 index 00000000000..78700936fb0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi normal (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a > א >‬</div> + + +<div class="ref" dir="ltr">‭> a > א >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-002.xht new file mode 100644 index 00000000000..f22d1d7c278 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, unicode-bidi normal (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> א > a >‬</div> + + +<div class="ref" dir="ltr">‭> א > a >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-003.xht new file mode 100644 index 00000000000..3b05f79fb8c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi normal (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< a < א <‬</div> + + +<div class="ref" dir="rtl">‭< a < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-004.xht new file mode 100644 index 00000000000..2310f7f9345 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, unicode-bidi normal (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< א < a <‬</div> + + +<div class="ref" dir="rtl">‭< א < a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-005.xht new file mode 100644 index 00000000000..ebb425d2b4a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi normal, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ב < א < a‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-006.xht new file mode 100644 index 00000000000..9227061f0b0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi normal, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-007.xht new file mode 100644 index 00000000000..d235a1db2ce --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-007.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭3 א‬</div> + + +<div class="ref" dir="ltr">‭3 א‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-008.xht new file mode 100644 index 00000000000..9e2de84db70 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭a 3‬</div> + + +<div class="ref" dir="rtl">‭a 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-009.xht new file mode 100644 index 00000000000..2a05af017b5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭a > b</div> + + +<div class="ref" dir="rtl">‭a > b</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-010.xht new file mode 100644 index 00000000000..24b27b505b6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-normal-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and unicode-bidi normal, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: normal; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭ב < א</div> + + +<div class="ref" dir="ltr">‭ב < א</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-001.xht new file mode 100644 index 00000000000..5f2a83457d4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, bidi-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + +<div class="ref" dir="ltr">‭> דגבא < dcba >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-002.xht new file mode 100644 index 00000000000..93c3ecfec50 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction rtl, bidi-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + +<div class="ref" dir="ltr">‭> dcba < דגבא >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-003.xht new file mode 100644 index 00000000000..ac50eee05db --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, bidi-override (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + +<div class="ref" dir="rtl">‭< אבגד > abcd <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-004.xht new file mode 100644 index 00000000000..34e6e160b5f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span direction ltr, bidi-override (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + +<div class="ref" dir="rtl">‭< abcd > אבגד <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-005.xht new file mode 100644 index 00000000000..9f76d2b8c62 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with bidi-override, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭d < ג < ב < a‬</div> + <div dir="rtl">‭d < c < b < a‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭d < ג < ב < a‬</div> + <div dir="rtl">‭d < c < b < a‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-006.xht new file mode 100644 index 00000000000..385b12026ad --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with bidi-override, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ב > ג > ד‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭א > b > c > ד‬</div> + <div dir="ltr">‭א > ב > ג > ד‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-007.xht new file mode 100644 index 00000000000..fa65af402a9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-007.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭3 dcba‬</div> + + +<div class="ref" dir="ltr">‭3 dcba</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-008.xht new file mode 100644 index 00000000000..ebe2f088088 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭אבגד 3‬</div> + + +<div class="ref" dir="rtl">‭אבגד 3‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-009.xht new file mode 100644 index 00000000000..a6a6a759bbb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭אבגד > e‬</div> + + +<div class="ref" dir="rtl">‭אבגד > e‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-010.xht new file mode 100644 index 00000000000..19dc1454c69 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element isolation and bidi-override, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭ה < dcba‬</div> + + +<div class="ref" dir="ltr">‭ה < dcba‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-011.xht new file mode 100644 index 00000000000..8902c657e8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-011.xht @@ -0,0 +1,46 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: direction alone and inherited, bidi-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test b { direction: rtl; font-weight: normal; } +.test span { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + +<div class="ref" dir="ltr">‭> a > גב < cb > d >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-012.xht new file mode 100644 index 00000000000..0102394f5d8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-override-012.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: default direction, bidi-override</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 15em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + +<div class="ref" dir="ltr">‭> abcd > אבגד >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-001.xht new file mode 100644 index 00000000000..108b6415b1d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-001.xht @@ -0,0 +1,42 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, rtl (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> ג < b < א >‬</div> + +<div class="ref" dir="ltr">‭> ג < b < א >‬</div> + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-002.xht new file mode 100644 index 00000000000..766097d33fa --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: span unicode-bidi plaintext, rtl (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { direction: rtl; unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-003.xht new file mode 100644 index 00000000000..05557aa305a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-003.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, ltr (1)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< a > א > c <‬</div> + + +<div class="ref" dir="rtl">‭< a > א > c <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-004.xht new file mode 100644 index 00000000000..ee041be0663 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: span unicode-bidi plaintext, ltr (2)</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭> a > א > c >‬</div> + + +<div class="ref" dir="ltr">‭> a > א > c >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-005.xht new file mode 100644 index 00000000000..409f42e01e1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-005.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element as directional character with unicode-bidi plaintext, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + +<div class="ref"><div dir="rtl">‭a > ב < א > d‬</div> + <div dir="rtl">‭a > b > c > d‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-006.xht new file mode 100644 index 00000000000..f3212ccd7ef --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-006.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction/unicode-bidi: element as directional character with unicode-bidi plaintext, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + +<div class="ref"><div dir="ltr">‭ד < b > c < א‬</div> + <div dir="ltr">‭ד < ג < ב < א‬</div> + </div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-007.xht new file mode 100644 index 00000000000..d31bdb3b70b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-007.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, rtl + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭א 3‬</div> + + +<div class="ref" dir="ltr">‭א 3‬</div> + + + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-008.xht new file mode 100644 index 00000000000..6129d1f4de8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, ltr + number</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭3 a‬</div> + + +<div class="ref" dir="rtl">‭3 a‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-009.xht new file mode 100644 index 00000000000..84e99ff8617 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-009.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, rtl list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭b < a</div> + + +<div class="ref" dir="rtl">‭b < a</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-010.xht new file mode 100644 index 00000000000..f20e7f17764 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/bidi-plaintext-010.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: element isolation and unicode-bidi plaintext, ltr list</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test span { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="ltr">‭א > ב</div> + + +<div class="ref" dir="ltr">‭א > ב</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-001.xht new file mode 100644 index 00000000000..4ae9730efe7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< c < ב < a <‬</div> + + +<div class="ref" dir="rtl">‭< c < ב < a <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-002.xht new file mode 100644 index 00000000000..b8655029cc7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: ltr; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> + +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-003.xht new file mode 100644 index 00000000000..323129f2082 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-embed-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref"> +<div dir="rtl">‭< c < ב < a <‬</div> +<div dir="rtl">‭< c < ב < a <‬</div> +</div> + +<div class="ref"> +<div dir="rtl">‭< c < ב < a <‬</div> +<div dir="rtl">‭< c < ב < a <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-001-ref.xht new file mode 100644 index 00000000000..ab4e710f5dc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-001-ref.xht @@ -0,0 +1,40 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2014-12-30 --> + + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + div + { + background-color: yellow; + direction: ltr; + font: 1.25em/1 Ahem; + width: 21em; + } + + img { vertical-align: top; } + ]]></style> + </head> + <body> + + <div><img src="support/blue20x20.png" width="420" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="420" height="20" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-002-ref.xht new file mode 100644 index 00000000000..7933827951e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-002-ref.xht @@ -0,0 +1,46 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2014-11-26 --> + + <!-- This reference file is the right-aligned version of + block-flow-direction-001-ref.xht + --> + + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + body { direction: rtl; } + + div + { + background-color: yellow; + direction: ltr; + font: 1.25em/1 Ahem; + width: 21em; + } + + img { vertical-align: top; } + ]]></style> + </head> + <body> + + <div><img src="support/blue20x20.png" width="420" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="80" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="40" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> <img src="support/blue20x20.png" width="20" height="20" alt="Image download support must be enabled" /> + + <img src="support/blue20x20.png" width="420" height="20" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-025-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-025-ref.xht new file mode 100644 index 00000000000..18ce96405a6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-flow-direction-025-ref.xht @@ -0,0 +1,31 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + p + { + margin: 0px; + } + + img + { + float: right; + padding-left: 16px; + } + ]]></style> + </head> + + <body> + + <p><img src="support/swatch-blue.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/block-flow-direction-025-exp-res.png" width="359" height="36" alt="Image download support must be enabled" /></p> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-001.xht new file mode 100644 index 00000000000..891699d99df --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-002.xht new file mode 100644 index 00000000000..3165c188602 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: ltr; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-003.xht new file mode 100644 index 00000000000..1910033e8de --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-004.xht new file mode 100644 index 00000000000..1768b517afc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-004.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div override inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: bidi-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-001.xht new file mode 100644 index 00000000000..8a833c79b6e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-001.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + +<div class="ref" dir="rtl">‭< fe < דג < ba <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-002.xht new file mode 100644 index 00000000000..75ea02560b9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-002.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div override ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: ltr; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div dir="rtl"> +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-003.xht new file mode 100644 index 00000000000..74b63bad7fa --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-003.xht @@ -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 lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>direction: div direction ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + +<div class="ref" dir="ltr">‭> ab > גד > ef >‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-004.xht new file mode 100644 index 00000000000..84f86d77a44 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-override-isolate-004.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div override inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { direction: rtl; unicode-bidi: isolate-override; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + +<div class="ref"> +<div dir="rtl">‭< fe < דג < ba <‬</div> +<div dir="rtl">‭< ef < דג < ab <‬</div> +<div dir="rtl">‭< fe < דג < ba <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-001.xht new file mode 100644 index 00000000000..4c160d0dddd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-001.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext, rtl</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> + + + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + + +<div class="ref" dir="rtl">‭< ג < b < א <‬</div> + + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-002.xht new file mode 100644 index 00000000000..e74202a8c2d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-002.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext, ltr</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> + +<div dir="rtl"> +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> + +<div class="ref" dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-003.xht new file mode 100644 index 00000000000..a226aefa058 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-003.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext inheritance</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="ltr">‭> א > b > ג >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +</div> + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="ltr">‭> א > b > ג >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-004.xht new file mode 100644 index 00000000000..978b146332e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/block-plaintext-004.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> +<meta charset="utf-8" /> +<title>unicode-bidi: div plaintext with br</title> + +<link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida" /> +<style type="text/css"> +.test { unicode-bidi: plaintext; } + + /* the following styles are not part of the test */ +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; width: 10em; padding: 5px; clear: both; } +input { margin: 5px; } +@font-face { + font-family: 'ezra_silregular'; + src: url('support/sileot-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; + } +.test, .ref { font-family: ezra_silregular, serif; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> + + +<!--Notes: +Key to entities used below: + א ... ו - The first six Hebrew letters (strongly RTL). + ‭ - The LRO (left-to-right-override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. +--> + + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +<div dir="ltr">‭> a > ב > c >‬</div> +</div> + +<div class="ref"> +<div dir="ltr">‭> a > ב > c >‬</div> +<div dir="rtl">‭< ג < b < א <‬</div> +<div dir="ltr">‭> a > ב > c >‬</div> +</div> + + + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/border-spacing-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/border-spacing-vrl-002-ref.xht new file mode 100644 index 00000000000..e7f22ff953e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/border-spacing-vrl-002-ref.xht @@ -0,0 +1,21 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="200" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vlr-005-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vlr-005-ref.xht new file mode 100644 index 00000000000..a5bbbd5497f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vlr-005-ref.xht @@ -0,0 +1,89 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + div > img + { + margin-left: 8px; + margin-right: 1em; + } + + table + { + background-color: yellow; + border-spacing: 0px; + border: orange solid 50px; + display: inline-table; + height: 300px; + vertical-align: top; + width: 300px; + } + + td + { + padding: 0px; + } + + td.first-row + { + height: 29px; + vertical-align: top; + } + + td#middle-row + { + text-align: center; + } + + td.third-row + { + height: 25px; + } + + span.blue + { + background-color: blue; + color: white; + height: 25px; + text-align: left; + width: 25px; + } + + span#top-left, span#bottom-left + { + float: left; + } + + span#top-right, span#bottom-right + { + float: right; + } + ]]></style> + </head> + + <body> + + <div> +<img src="support/pass-cdts-box-offsets-rel-pos.png" width="304" height="35" alt="Image download support must be enabled" /><!-- + The image says: + " + Test passes if there is a blue square + at each corner of the yellow square. + " + --><table> + <tr><td class="first-row"><span class="blue" id="top-left">TL</span></td><td class="first-row"><span class="blue" id="top-right">TR</span></td></tr> + <tr><td id="middle-row" colspan="2"><img src="support/100x100-lime.png" alt="Image download support must be enabled" /></td></tr> + <tr><td class="third-row"><span class="blue" id="bottom-left">BL</span></td><td class="third-row"><span class="blue" id="bottom-right">BR</span></td></tr> + </table> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vrl-004-ref.xht new file mode 100644 index 00000000000..00bf6022448 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/box-offsets-rel-pos-vrl-004-ref.xht @@ -0,0 +1,96 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + div + { + text-align: right; + } + + div > img + { + margin-left: 1em; + margin-right: 8px; + } + + table + { + background-color: yellow; + border-spacing: 0px; + border: orange solid 50px; + display: inline-table; + height: 300px; + vertical-align: top; + width: 300px; + } + + td + { + padding: 0px; + } + + td.first-row + { + height: 29px; + vertical-align: top; + } + + td#middle-row + { + text-align: center; + } + + td.third-row + { + height: 25px; + } + + span.blue + { + background-color: blue; + color: white; + height: 25px; + text-align: left; + width: 25px; + } + + span#top-left, span#bottom-left + { + float: left; + } + + span#top-right, span#bottom-right + { + float: right; + } + ]]></style> + </head> + + <body> + + <div> + <table> + <tr><td class="first-row"><span class="blue" id="top-left">TL</span></td><td class="first-row"><span class="blue" id="top-right">TR</span></td></tr> + <tr><td id="middle-row" colspan="2"><img src="support/100x100-lime.png" alt="Image download support must be enabled" /></td></tr> + <tr><td class="third-row"><span class="blue" id="bottom-left">BL</span></td><td class="third-row"><span class="blue" id="bottom-right">BR</span></td></tr> + </table><img src="support/pass-cdts-box-offsets-rel-pos.png" width="304" height="35" alt="Image download support must be enabled" /> + + <!-- + The image says: + " + Test passes if there is a blue square + at each corner of the yellow square. + " + --> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/central-baseline-alignment-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/central-baseline-alignment-002-ref.xht new file mode 100644 index 00000000000..56efaa908a5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/central-baseline-alignment-002-ref.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Reftest Reference</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + img + { + vertical-align: top; + } + + img + { + padding-left: 60px; + } + + img + br + img + { + padding-left: 30px; + } + + img + br + img + br + img + { + padding-left: 75px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div><img src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled" /><br /><img src="support/swatch-blue.png" width="120" height="120" alt="Image download support must be enabled" /><br /><img src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-002-ref.xht new file mode 100644 index 00000000000..86541ff1102 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-002-ref.xht @@ -0,0 +1,32 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img + { + padding-right: 40px; + } + + img + img + { + padding-right: 20px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-004-ref.xht new file mode 100644 index 00000000000..68842f5e5e2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-004-ref.xht @@ -0,0 +1,27 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img + { + padding-right: 80px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="60" height="100" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-006-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-006-ref.xht new file mode 100644 index 00000000000..7f680b466fe --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-006-ref.xht @@ -0,0 +1,32 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + img + { + padding-right: 60px; + } + + img + img + { + padding-right: 20px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="20" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-008-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-008-ref.xht new file mode 100644 index 00000000000..ff43c190d62 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/clearance-calculations-vrl-008-ref.xht @@ -0,0 +1,36 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + html + { + direction: rtl; + } + + img + { + vertical-align: top; + } + + img#green-square + { + padding-left: 8px; + padding-right: 100px; + } + ]]></style> + </head> + + <body> + + <div><img id="green-square" src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /><img src="support/pass-cdts-clearance-calculations.png" width="474" height="17" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/css-flexbox-row-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/css-flexbox-row-ref.xht new file mode 100644 index 00000000000..0357fe55d14 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/css-flexbox-row-ref.xht @@ -0,0 +1,29 @@ +<!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 charset="utf-8" /> + <title>CSS Reftest Reference</title> + <link href="mailto:info@ogaoga.org" rel="author" title="Tsutomu ogaoga Ogasawara" /> + <style type="text/css"> + .container { + color: white; + } + .item { + writing-mode: vertical-rl; + background: green; + height: 3em; + width: 3em; + } + </style> +</head> +<body> + <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p> + + <div class="container"> + <div class="item">１２３<br />ａｂｃ</div> + <div class="item">４５６<br />ｄｅｆ</div> + <div class="item">７８９<br />ｇｈｉ</div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vlr-003-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vlr-003-ref.xht new file mode 100644 index 00000000000..2c1482b312d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vlr-003-ref.xht @@ -0,0 +1,28 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + position: absolute; + top: 252px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-002-ref.xht new file mode 100644 index 00000000000..471ab3dc98d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-002-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + left: 108px; + position: absolute; + top: 252px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-004-ref.xht new file mode 100644 index 00000000000..aa0f3d85fb1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/direction-vrl-004-ref.xht @@ -0,0 +1,28 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + left: 108px; + position: absolute; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/extract-ordered-list-direction-and-writing-modes-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/extract-ordered-list-direction-and-writing-modes-ref.xht new file mode 100644 index 00000000000..bea80d3d53e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/extract-ordered-list-direction-and-writing-modes-ref.xht @@ -0,0 +1,75 @@ +<!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 Reftest Reference</title> + <link href="mibalan@adobe.com" rel="author" title="Mihai Balan" /> + <style> + .direction-rtl { + direction: rtl; + background-color: lightgray; + } + .writing-mode-vrl { + writing-mode: vertical-rl; + background-color: lightblue; + } + .writing-mode-vlr { + writing-mode: vertical-lr; + background-color: lightgreen; + } + .region { + border: thick solid black; + width: 15em; + height: 15em; + float: left; + margin: 0 1em; + } + .region>ol { + margin: 0; + } + </style> + </head> + <body> + <p>Test pases if you see three rectangles with black borders containing a numbered list as described below. Each of the lists has a total of six items, three being in a nested list after the second item.</p> + <p>The first rectangle should display the numbered list on a light gray background. The list items should be right-aligned, with the numbers on the right side of the list item text. Also, the list item numbering should have a period prepended to the actual number (<em>e.g.</em> <strong>.1</strong>) instead of appended to the actual number (<em>e.g.</em> <strong>1.</strong>).</p> + <p>The second rectangle should display the numbered list on a light blue background. The text should be rotated 90 degrees clockwise with the list items progressing right to left (or top-to-bottom relative to the rotated list) this means the right-most list item should have the number 1.</p> + <p>The third rectangle should display the numbered list on a light green background. The text should be rotated 90 degrees clockwise, with the list items progressing left to right (or bottom-to-top relative to the rotated list) this means the right-most list item should have the number 3.</p> + <div class="region"> + <ol class="direction-rtl"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + </div> + <div class="region"> + <ol class="writing-mode-vrl"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + </div> + <div class="region"> + <ol class="writing-mode-vlr"> + <li>Top-level list, item 1</li> + <li>Top-level list, item 2 + <ol> + <li>First inner list, item 1</li> + <li>First inner list, item 2</li> + <li>First inner list, item 3</li> + </ol> + </li> + <li>Top-level list, item 3</li> + </ol> + </div> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-007-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-007-ref.xht new file mode 100644 index 00000000000..aea37939777 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-007-ref.xht @@ -0,0 +1,41 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-03-08 --> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + p + { + margin: 0px 8px; + } + + div + { + height: 200px; + margin-left: 8px; + width: 200px; + } + + img + { + vertical-align: bottom; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div> + <img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-009-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-009-ref.xht new file mode 100644 index 00000000000..e396d7f97e9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vlr-009-ref.xht @@ -0,0 +1,36 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-03-08 --> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + margin: 0px 8px; + } + + img + { + vertical-align: top; + } + + div > div + { + display: inline-block; + margin-left: 16px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /><div><img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-tr.png" alt="Image download support must be enabled" /><br /><img src="support/test-bl.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /></div></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-006-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-006-ref.xht new file mode 100644 index 00000000000..6ffac6d5eaa --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-006-ref.xht @@ -0,0 +1,46 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-03-08 --> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + html + { + direction: rtl; + } + + p + { + margin: 0px 8px; + } + + div + { + height: 200px; + margin-right: 8px; + width: 200px; + } + + img + { + vertical-align: bottom; + } + ]]></style> + </head> + + <body> + + <p><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /></p> + + <div> + <img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-008-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-008-ref.xht new file mode 100644 index 00000000000..92caf8bdec4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-008-ref.xht @@ -0,0 +1,41 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-03-08 --> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + html + { + direction: rtl; + } + + div + { + margin: 0px 8px; + } + + img + { + vertical-align: top; + } + + div > div + { + display: inline-block; + margin-right: 16px; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-float-contiguous.png" width="297" height="35" alt="Image download support must be enabled" /><div><img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-tl.png" alt="Image download support must be enabled" /><br /><img src="support/test-br.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /></div></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-012-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-012-ref.xht new file mode 100644 index 00000000000..b33b5e827bf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/float-contiguous-vrl-012-ref.xht @@ -0,0 +1,38 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + html + { + direction: rtl; + } + + p + { + direction: ltr; + line-height: 1.25; + } + + strong + { + line-height: 1; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-horizontal-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-horizontal-notref.xht new file mode 100644 index 00000000000..23bba09bed6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-horizontal-notref.xht @@ -0,0 +1,23 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/full-width-notcu-notref.xht" rel="mismatch" /> +<style> +.tcu-all { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div> + <p>６月<span class="tcu-all">19</span>日</p> + <p>６月<span class="tcu-all">19</span>日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-notcu-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-notcu-notref.xht new file mode 100644 index 00000000000..2db212d0e7f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-notcu-notref.xht @@ -0,0 +1,23 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/full-width-horizontal-notref.xht" rel="mismatch" /> +<style> +.test { + writing-mode: vertical-rl; +} +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div class="test"> + <p>６月19日</p> + <p>６月19日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-ref.xht new file mode 100644 index 00000000000..e003471b676 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/full-width-ref.xht @@ -0,0 +1,28 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/full-width-notcu-notref.xht" rel="mismatch" /> +<link href="reference/full-width-horizontal-notref.xht" rel="mismatch" /> +<style> +.test { + writing-mode: vertical-rl; +} + +.tcu-all { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if the following paragraphs are identical:</p> + +<div class="test"> + <p>６月<span class="tcu-all">19</span>日</p> + <p>６月<span class="tcu-all">19</span>日</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x1-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x1-notref.xht new file mode 100644 index 00000000000..6ab214795a9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x1-notref.xht @@ -0,0 +1,24 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<meta content="ahem" name="flags" /> +<style> +.test { + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>x</p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x3-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x3-notref.xht new file mode 100644 index 00000000000..d4133e77950 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x3-notref.xht @@ -0,0 +1,24 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<meta content="ahem" name="flags" /> +<style> +.test { + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxx</p> + <p>xxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x4-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x4-notref.xht new file mode 100644 index 00000000000..f7014b9f521 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x4-notref.xht @@ -0,0 +1,24 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<meta content="ahem" name="flags" /> +<style> +.test { + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxxx</p> + <p>xxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x5-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x5-notref.xht new file mode 100644 index 00000000000..f65dab0bc64 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-ahem-1x5-notref.xht @@ -0,0 +1,24 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<meta content="ahem" name="flags" /> +<style> +.test { + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxxxx</p> + <p>xxxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vlr-003-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vlr-003-ref.xht new file mode 100644 index 00000000000..d4ab59e9368 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vlr-003-ref.xht @@ -0,0 +1,47 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + html + { + height: 100%; + } + + body + { + height: 100%; + margin: 0px; + } + + div + { + height: 100%; + } + + img + { + margin-left: 1em; + vertical-align: top; + } + + img + img + { + height: 100%; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-horiz-rule.png" width="260" height="36" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="10" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-002-ref.xht new file mode 100644 index 00000000000..d10eb99935d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-002-ref.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Reftest Reference</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="image" name="flags" /> + + <style type="text/css"><![CDATA[ + html + { + height: 100%; + } + + body + { + direction: rtl; + height: 100%; + margin: 0px; + } + + div + { + height: 100%; + } + + img + { + margin-right: 1em; + vertical-align: top; + } + + img + img + { + height: 100%; + } + ]]></style> + </head> + + <body> + + <div><img src="support/pass-cdts-horiz-rule.png" width="260" height="36" alt="Image download support must be enabled" /><img src="support/swatch-green.png" width="10" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-004-ref.xht new file mode 100644 index 00000000000..eef7f9a23da --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/horizontal-rule-vrl-004-ref.xht @@ -0,0 +1,30 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta content="" name="flags" /> + + <style type="text/css"><![CDATA[ + hr + { + background-color: green; + border: transparent none 0px; + height: 10px; + margin: 0px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is an horizontal green bar and <strong>no red</strong>.</p> + + <hr /> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-001-ref.xht new file mode 100644 index 00000000000..a50243ae7a9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-001-ref.xht @@ -0,0 +1,55 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + div.control { + font-size: 2em; + background-color: orange; + } + img { + margin-left: -300px; + } + div.control > span { + background-color: yellow; + padding: 0em 1em; + } + div.control1 { + color: orange; + margin-top: 1em; + } + div.control1 > span { + color: yellow; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' 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 class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + + <div class="control control1">LLLL<span>ABCD</span></div> + <div class="control control2">LLLL<span>LLLLL</span>LLLL<img src="support/blue-horiz-line-320x1.png" alt="Image download support must be enabled" /></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-004-ref.xht new file mode 100644 index 00000000000..85c00c36a71 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-block-alignment-004-ref.xht @@ -0,0 +1,85 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + div.control { + font-size: 2em; + background-color: orange; + } + img { + margin-left: -300px; + } + + /* 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 class="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> + + <div class="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> + + <div class="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> + + <div class="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> + + <div class="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> + + <div class="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> + + <div class="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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-002-ref.xht new file mode 100644 index 00000000000..e96f00594f8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-002-ref.xht @@ -0,0 +1,19 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-16 --> + + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + img { vertical-align: top; } + ]]></style> + </head> + <body> + + <p>Test passes if there is a cat and if the <strong>cat is not rotated</strong>.</p> + + <div><img id="cat" src="support/cat.png" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-004-ref.xht new file mode 100644 index 00000000000..ed35d3cacb8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/inline-replaced-vrl-004-ref.xht @@ -0,0 +1,30 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-16 --> + + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + div + { + height: 200px; + width: 200px; + } + + img + { + vertical-align: top; + } + ]]></style> + </head> + <body> + + <p>Test passes if there is an unbroken drawing of a yin-yang (☯) symbol.</p> + + <div> + <img src="support/test-tl.png" alt="Image download support must be enabled" /><img src="support/test-tr.png" alt="Image download support must be enabled" /><img src="support/test-bl.png" alt="Image download support must be enabled" /><img src="support/test-br.png" alt="Image download support must be enabled" /> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/margin-vrl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/margin-vrl-002-ref.xht new file mode 100644 index 00000000000..f02a1f6ce4d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/margin-vrl-002-ref.xht @@ -0,0 +1,34 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + margin-bottom: 1em; + } + + img + { + vertical-align: top; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there are 2 <strong>identical</strong> blue rectangles, each with 2 small yellow squares: the layout must be identical.</p> + + <div><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + <div><img src="support/blue-yellow-206w-165h.png" width="206" height="165" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-filled-green-100px-square.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-filled-green-100px-square.xht new file mode 100644 index 00000000000..52353556602 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-filled-green-100px-square.xht @@ -0,0 +1,28 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <style type="text/css"><![CDATA[ + div + { + background-color: green; + height: 100px; + width: 100px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-if-there-is-no-red.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-if-there-is-no-red.xht new file mode 100644 index 00000000000..0aed086093c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/ref-if-there-is-no-red.xht @@ -0,0 +1,17 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + </head> + + <body> + + <p>Test passes if there is <strong>no red</strong>.</p> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-lime.png Binary files differnew file mode 100644 index 00000000000..1b947700808 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-red.png Binary files differnew file mode 100644 index 00000000000..57bf3ddc521 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/100x100-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-green.png Binary files differnew file mode 100644 index 00000000000..b98ca0ba0a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-lime.png Binary files differnew file mode 100644 index 00000000000..cb397fb090e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-maroon.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-maroon.png Binary files differnew file mode 100644 index 00000000000..3f86b072195 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-maroon.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-navy.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-navy.png Binary files differnew file mode 100644 index 00000000000..9b9a03955ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-navy.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-red.png Binary files differnew file mode 100644 index 00000000000..6bd73ac1018 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-white.png Binary files differnew file mode 100644 index 00000000000..dd43faec54a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/1x1-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-gg-rr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-gg-rr.png Binary files differnew file mode 100644 index 00000000000..84f5b2a4f1d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-gg-rr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-green.png Binary files differnew file mode 100644 index 00000000000..b3c8cf3eb4c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-red.png Binary files differnew file mode 100644 index 00000000000..823f125b8e4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/60x60-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/DejaVuSerif-webfont.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/DejaVuSerif-webfont.woff Binary files differnew file mode 100644 index 00000000000..4583cc675d7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/DejaVuSerif-webfont.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/README b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/README new file mode 100644 index 00000000000..69d1737bead --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/README @@ -0,0 +1,29 @@ +CSS Global Support Directory +============================ + +This directory contains common support files (such as images and external +style sheets). These are sync'ed into the support directories of all our +test suites. If you have test-suite-specific support files, please add +them to the appropriate test-suite-specific support/ directory. + +If you add to a support/ directory, please run the tools/supportprop.py +script from the top of the repository to cascade support files into the +lower-level support directories. + +Description of the Common Support File Collection +------------------------------------------------- + +The 1x1-* images are all exactly one pixel. + +The swatch-* images all use 15x15 cells. + +The square-* images all use 15x15 cells with one pixel borders. + +The pattern-* images use cells of various sizes: + + pattern-gg-gr.png 20x20 + pattern-grg-rgr-grg.png 20x20 + pattern-rgr-grg-rgr.png 20x20 + pattern-tr.png 15x15 + pattern-grg-rrg-rgg.png 15x15 + diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/a-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/a-green.css new file mode 100644 index 00000000000..b0dbb071d5b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/a-green.css @@ -0,0 +1 @@ +.a { color: green; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/b-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/b-green.css new file mode 100644 index 00000000000..a0473f5ca26 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/b-green.css @@ -0,0 +1 @@ +.b { color: green; }
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-2row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-2row-320x320.png Binary files differnew file mode 100644 index 00000000000..4f354e93527 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-2row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-3row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-3row-320x320.png Binary files differnew file mode 100644 index 00000000000..6eded69a4a3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-2col-3row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-2row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-2row-320x320.png Binary files differnew file mode 100644 index 00000000000..5f4b53c46b7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-2row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-3row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-3row-320x320.png Binary files differnew file mode 100644 index 00000000000..4c2f6c8e632 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/bg-red-3col-3row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/block-flow-direction-025-exp-res.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/block-flow-direction-025-exp-res.png Binary files differnew file mode 100644 index 00000000000..851eeea0398 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/block-flow-direction-025-exp-res.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-220x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-220x1.png Binary files differnew file mode 100644 index 00000000000..3898d5a2d9e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-220x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-320x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-320x1.png Binary files differnew file mode 100644 index 00000000000..7d9151c848a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-horiz-line-320x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x220.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x220.png Binary files differnew file mode 100644 index 00000000000..07b0239fc52 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x220.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x320.png Binary files differnew file mode 100644 index 00000000000..6049e271506 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-vert-line-1x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-yellow-206w-165h.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-yellow-206w-165h.png Binary files differnew file mode 100644 index 00000000000..47ceb84d3fb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue-yellow-206w-165h.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue1x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue1x1.png Binary files differnew file mode 100644 index 00000000000..667b6558892 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue1x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue20x20.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue20x20.png Binary files differnew file mode 100644 index 00000000000..e0af5553303 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/blue20x20.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/c-red.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/c-red.css new file mode 100644 index 00000000000..d4ba5c64e95 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/c-red.css @@ -0,0 +1 @@ +.c { color: red; }
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/cat.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/cat.png Binary files differnew file mode 100644 index 00000000000..85dd7324815 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/cat.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-002.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-002.png Binary files differnew file mode 100644 index 00000000000..7fc9f14ed6e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-002.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-004.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-004.png Binary files differnew file mode 100644 index 00000000000..2d1355e3bdb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-004.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-006.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-006.png Binary files differnew file mode 100644 index 00000000000..5145c22c485 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/clearance-calculation-vrl-006.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-green.css new file mode 100644 index 00000000000..537104e6633 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-green.css @@ -0,0 +1 @@ +.import { color: green; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-red.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-red.css new file mode 100644 index 00000000000..9945ef47114 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/import-red.css @@ -0,0 +1 @@ +.import { color: red; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-bottom-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-bottom-200x300.png Binary files differnew file mode 100644 index 00000000000..6e30eba507a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-bottom-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-center-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-center-200x300.png Binary files differnew file mode 100644 index 00000000000..6025c4e85be --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-center-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-side-filled-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-side-filled-square-40x160.png Binary files differnew file mode 100644 index 00000000000..86fd7e5671d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-side-filled-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-top-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-top-200x300.png Binary files differnew file mode 100644 index 00000000000..43e739acbc2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/left-top-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/margin-collapse-2em-space-wm-vert.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/margin-collapse-2em-space-wm-vert.png Binary files differnew file mode 100644 index 00000000000..8a2fa55efdf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/margin-collapse-2em-space-wm-vert.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/mplus-1p-regular.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/mplus-1p-regular.woff Binary files differnew file mode 100644 index 00000000000..42cfff628b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/mplus-1p-regular.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/opaque-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/opaque-square-40x160.png Binary files differnew file mode 100644 index 00000000000..11636f5f771 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/opaque-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p1.png Binary files differnew file mode 100644 index 00000000000..f5adb11b4b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p2.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p2.png Binary files differnew file mode 100644 index 00000000000..7ecf84bae34 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p2.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p3.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p3.png Binary files differnew file mode 100644 index 00000000000..d7c58d62243 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p3.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p4.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p4.png Binary files differnew file mode 100644 index 00000000000..04dc0fe2e9e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/page-flow-direction-002p4.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-abs-pos-non-replaced.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-abs-pos-non-replaced.png Binary files differnew file mode 100644 index 00000000000..15fd6065ef6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-abs-pos-non-replaced.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-002.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-002.png Binary files differnew file mode 100644 index 00000000000..a0db6909418 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-002.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-004.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-004.png Binary files differnew file mode 100644 index 00000000000..ec130f10f46 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-004.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-006.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-006.png Binary files differnew file mode 100644 index 00000000000..981741b7e53 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-006.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-008.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-008.png Binary files differnew file mode 100644 index 00000000000..9b2a0610e4e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-008.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-010.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-010.png Binary files differnew file mode 100644 index 00000000000..a2d66146186 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-010.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-012.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-012.png Binary files differnew file mode 100644 index 00000000000..23b1beb9cd4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-012.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-014.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-014.png Binary files differnew file mode 100644 index 00000000000..64e081c72f1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-014.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-016.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-016.png Binary files differnew file mode 100644 index 00000000000..952e0089b8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-bg-pos-vrl-016.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-box-offsets-rel-pos.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-box-offsets-rel-pos.png Binary files differnew file mode 100644 index 00000000000..e81c0ae4cf5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-box-offsets-rel-pos.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-clearance-calculations.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-clearance-calculations.png Binary files differnew file mode 100644 index 00000000000..ec502d3532a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-clearance-calculations.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-float-contiguous.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-float-contiguous.png Binary files differnew file mode 100644 index 00000000000..8d35d98e9c4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-float-contiguous.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-horiz-rule.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-horiz-rule.png Binary files differnew file mode 100644 index 00000000000..f9cc0b1eeff --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pass-cdts-horiz-rule.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..b14c75ea2c0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr.png Binary files differnew file mode 100644 index 00000000000..091de70bb72 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-gr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..80c7035f1fc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rr-100x100.png Binary files differnew file mode 100644 index 00000000000..a98636ddef3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gg-rr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gg-100x100.png Binary files differnew file mode 100644 index 00000000000..fd1f7a7b50a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..431b99f933a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..63248d4dd1f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-gr-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rgr-grg.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rgr-grg.png Binary files differnew file mode 100644 index 00000000000..9b88fbd8114 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rgr-grg.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rrg-rgg.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rrg-rgg.png Binary files differnew file mode 100644 index 00000000000..fcf4f3fd7d9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-grg-rrg-rgg.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gg-100x100.png Binary files differnew file mode 100644 index 00000000000..47ee743880e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..6b19ec9a4e7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..e28bdba9dd6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rg-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rgr-grg-rgr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rgr-grg-rgr.png Binary files differnew file mode 100644 index 00000000000..d454e3a630c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-rgr-grg-rgr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-tr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-tr.png Binary files differnew file mode 100644 index 00000000000..8b4b25364e0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/pattern-tr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-bottom-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-bottom-200x300.png Binary files differnew file mode 100644 index 00000000000..38904b25087 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-bottom-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-center-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-center-200x300.png Binary files differnew file mode 100644 index 00000000000..b9987017a06 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-center-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-side-filled-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-side-filled-square-40x160.png Binary files differnew file mode 100644 index 00000000000..f76b2083118 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-side-filled-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-top-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-top-200x300.png Binary files differnew file mode 100644 index 00000000000..59467ec3f18 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/right-top-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50%.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50%.png Binary files differnew file mode 100644 index 00000000000..cf2eea6b438 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50%.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50px.png Binary files differnew file mode 100644 index 00000000000..9f46583665c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-h-50px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-100px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-100px.png Binary files differnew file mode 100644 index 00000000000..a837eca2225 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-100px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-50px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-50px.png Binary files differnew file mode 100644 index 00000000000..84141028020 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/ruler-v-50px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/sileot-webfont.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/sileot-webfont.woff Binary files differnew file mode 100644 index 00000000000..81547578d36 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/sileot-webfont.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/solidblue.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/solidblue.png Binary files differnew file mode 100644 index 00000000000..8584a701a80 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/solidblue.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-purple.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-purple.png Binary files differnew file mode 100644 index 00000000000..0f522d78728 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-purple.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-teal.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-teal.png Binary files differnew file mode 100644 index 00000000000..e567f51b91b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-teal.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-white.png Binary files differnew file mode 100644 index 00000000000..5853cbb238c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/square-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-blue.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-blue.png Binary files differnew file mode 100644 index 00000000000..bf2759634d4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-blue.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-fuchsia.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-fuchsia.png Binary files differnew file mode 100644 index 00000000000..3f8f8b4ea37 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-fuchsia.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-green.png Binary files differnew file mode 100644 index 00000000000..0aa79b0c86b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-lime.png Binary files differnew file mode 100644 index 00000000000..55fd7fdaedf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-orange.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-orange.png Binary files differnew file mode 100644 index 00000000000..d3cd498b52b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-orange.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-red.png Binary files differnew file mode 100644 index 00000000000..1caf25c992a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-teal.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-teal.png Binary files differnew file mode 100644 index 00000000000..0293ce89dea --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-teal.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-white.png Binary files differnew file mode 100644 index 00000000000..1a7d4323d77 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-yellow.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-yellow.png Binary files differnew file mode 100644 index 00000000000..1591aa0e2e2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/swatch-yellow.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/tcu-font.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/tcu-font.woff Binary files differnew file mode 100644 index 00000000000..c880aaab5cf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/tcu-font.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-bl.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-bl.png Binary files differnew file mode 100644 index 00000000000..904e24e996a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-bl.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-br.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-br.png Binary files differnew file mode 100644 index 00000000000..f413ff5c1a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-br.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-inner-half-size.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-inner-half-size.png Binary files differnew file mode 100644 index 00000000000..e473bf80efc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-inner-half-size.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-outer.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-outer.png Binary files differnew file mode 100644 index 00000000000..82eeace7fc0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-outer.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-style.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-style.css new file mode 100644 index 00000000000..f2ffea039b1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-style.css @@ -0,0 +1,18 @@ + #test01, #test02, #test03{ + width: 50px; + height: 50px; + text-align:center; + font-size: 20px; + } + #test{ + background: #ff0000; + } + #test01{ + background: #7FFF00; + } + #test02{ + background: #00FFFF; + } + #test03{ + background: #4169E1; + } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tl.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tl.png Binary files differnew file mode 100644 index 00000000000..f6ac0ef7e8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tl.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tr.png Binary files differnew file mode 100644 index 00000000000..59843ae54b6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/test-tr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-mixed-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-mixed-001.png Binary files differnew file mode 100644 index 00000000000..2bd5927f901 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-mixed-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-left-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-left-001.png Binary files differnew file mode 100644 index 00000000000..51921a7e91a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-left-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-right-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-right-001.png Binary files differnew file mode 100644 index 00000000000..f4bfd48549f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-sideways-right-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-upright-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-upright-001.png Binary files differnew file mode 100644 index 00000000000..d7df4098ed2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/text-orientation-upright-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-form.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-form.png Binary files differnew file mode 100644 index 00000000000..53a3af92cd6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-form.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-horizontal-list-markers.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-horizontal-list-markers.png Binary files differnew file mode 100644 index 00000000000..ae8430fb46d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/vertical-horizontal-list-markers.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-59x59.png Binary files differnew file mode 100644 index 00000000000..50816d38f6b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-horiz-redline-bottom-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-horiz-redline-bottom-59x59.png Binary files differnew file mode 100644 index 00000000000..d6139238de3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-horiz-redline-bottom-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-center-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-center-59x59.png Binary files differnew file mode 100644 index 00000000000..c352b109548 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-center-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-left-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-left-59x59.png Binary files differnew file mode 100644 index 00000000000..8baf6f60404 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-left-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-right-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-right-59x59.png Binary files differnew file mode 100644 index 00000000000..7e881312b35 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/support/yellow-square-vert-redline-right-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vlr-009-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vlr-009-ref.xht new file mode 100644 index 00000000000..bd0674f3aec --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vlr-009-ref.xht @@ -0,0 +1,28 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + position: absolute; + top: 152px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vrl-008-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vrl-008-ref.xht new file mode 100644 index 00000000000..4f17b50d2ab --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-align-vrl-008-ref.xht @@ -0,0 +1,29 @@ +<!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="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + + <meta name="flags" content="image" /> + + <style type="text/css"><![CDATA[ + div + { + left: 108px; + position: absolute; + top: 152px; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><img src="support/swatch-green.png" width="100" height="100" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-002-ref.xht new file mode 100644 index 00000000000..401ca77433a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-002-ref.xht @@ -0,0 +1,39 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-29 --> + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + img + { + vertical-align: top; + } + + img + { + padding-left: 60px; + } + + img + br + img + { + padding-left: 30px; + } + + img + br + img + br + img + { + padding-left: 75px; + } + ]]></style> + +</head> + +<body> + +<p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + +<div><img src="support/swatch-orange.png" width="60" height="60" alt="Image download support must be enabled" /><br /><img src="support/swatch-blue.png" width="120" height="120" alt="Image download support must be enabled" /><br /><img src="support/swatch-orange.png" width="30" height="30" alt="Image download support must be enabled" /></div> + +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-006-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-006-ref.xht new file mode 100644 index 00000000000..8131d309ae9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-006-ref.xht @@ -0,0 +1,26 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-29 --> + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + + img + { + padding-left: 54px; + vertical-align: top; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>left edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div><img src="support/swatch-fuchsia.png" width="48" height="60" alt="Image download support must be enabled" /><br /><img src="support/swatch-fuchsia.png" width="96" height="120" alt="Image download support must be enabled" /><br /><img src="support/swatch-fuchsia.png" width="24" height="30" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-007-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-007-ref.xht new file mode 100644 index 00000000000..833aa250594 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-baseline-007-ref.xht @@ -0,0 +1,36 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2015-01-29 --> + <meta name="flags" content="image" /> + <style type="text/css"><![CDATA[ + + img + { + padding-left: 78px; + vertical-align: top; + } + + img + br + img + { + padding-left: 30px; + } + + img + br + img + br + img + { + padding-left: 102px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div><img src="support/swatch-fuchsia.png" width="48" height="60" alt="Image download support must be enabled" /><br /><img src="support/swatch-fuchsia.png" width="96" height="120" alt="Image download support must be enabled" /><br /><img src="support/swatch-fuchsia.png" width="24" height="30" alt="Image download support must be enabled" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-010-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-010-ref.xht new file mode 100644 index 00000000000..3706be35df2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-010-ref.xht @@ -0,0 +1,41 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-combine-horizontal-010.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en, ja"/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("../support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + div + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 2; + width: 4em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + .control + { + text-orientation: mixed; + -webkit-text-orientation: mixed; + } + </style> + </head> + <body lang="en"> + <p>Test passes if the upper block is <strong>identical</strong> to the lower block, including orientation of each character.</p> + <div class="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + <hr/> + <div class="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-011-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-011-ref.xht new file mode 100644 index 00000000000..a9540dc34a2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-combine-horizontal-011-ref.xht @@ -0,0 +1,41 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-combine-horizontal-011.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en, ja"/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("../support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + div + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 2; + width: 4em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + .control + { + text-orientation: upright; + -webkit-text-orientation: upright; + } + </style> + </head> + <body lang="en"> + <p>Test passes if the upper block is <strong>identical</strong> to the lower block, including orientation of each character.</p> + <div class="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + <hr/> + <div class="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-decoration-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-decoration-001-ref.xht new file mode 100644 index 00000000000..87c5707df81 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-decoration-001-ref.xht @@ -0,0 +1,27 @@ +<!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: text-combine-upright with decoration</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-with-decoration { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + text-decoration: underline; + } + </style> +</head> +<body> + <p>Test passes if this figure and the decoration are idencial</p> + <div class="tcu-with-decoration"> + 7 + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-notref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-notref.xht new file mode 100644 index 00000000000..dc2be191d14 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-notref.xht @@ -0,0 +1,26 @@ +<!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: text-combine-upright with text-emphasis</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-with-emphasis { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + } + </style> +</head> +<body> + <p>Test passes if this figure and the emphasis are idencial</p> + <div class="tcu-with-emphasis"> + 7 + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-ref.xht new file mode 100644 index 00000000000..351f3b14298 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-emphasis-001-ref.xht @@ -0,0 +1,28 @@ +<!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: text-combine-upright with text-emphasis</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <link href="reference/text-emphasis-001-notref.xht" rel="mismatch" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-with-emphasis { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + text-emphasis-style: open dot; + } + </style> +</head> +<body> + <p>Test passes if this figure and the emphasis are idencial</p> + <div class="tcu-with-emphasis"> + 7 + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-010-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-010-ref.xht new file mode 100644 index 00000000000..9f8f1abf4be --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-010-ref.xht @@ -0,0 +1,61 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orientation-010.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en, ja"/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("../support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + } + .control + { + text-combine-horizontal: none; + } + </style> + </head> + <body xml:lang="en"> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view" xml:lang="ja"><span class="control">月火水Abc<br/>def木金土</span></div> + <div class="view" xml:lang="ja"><span class="control">月火水Abc<br/>def木金土</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-011-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-011-ref.xht new file mode 100644 index 00000000000..77f79448dff --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-011-ref.xht @@ -0,0 +1,66 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orientation-011.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en, ja"/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("../support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + .control + { + } + .tcy /* tate-cyu-yoko: horizontal-in-vertical */ + { + text-combine-horizontal: all; + } + </style> + </head> + <body lang="en"> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view" lang="ja"><span class="control">月火水<span class="tcy">A</span><span class="tcy">b</span><span class="tcy">c</span><br/><span class="tcy">d</span><span class="tcy">e</span><span class="tcy">f</span>木金土</span></div> + <div class="view" lang="ja"><span class="control">月火水<span class="tcy">A</span><span class="tcy">b</span><span class="tcy">c</span><br/><span class="tcy">d</span><span class="tcy">e</span><span class="tcy">f</span>木金土</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-012-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-012-ref.xht new file mode 100644 index 00000000000..7d588e90441 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-012-ref.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orientation-012.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en"/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + .control + { + text-combine-horizontal: none; + } + </style> + </head> + <body lang="en"> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view"><span class="control">123Abc<br/>def456</span></div> + <div class="view"><span class="control">123Abc<br/>def456</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-013-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-013-ref.xht new file mode 100644 index 00000000000..9fcf9070da6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-013-ref.xht @@ -0,0 +1,36 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orietation-013.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en"/> + <style type="text/css"> + div + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 Ahem; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + </style> + </head> + <body> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong>.</p> + <div class="control_ahem"> 63 + 52 +7 1</div> + <div class="control_ahem"> 63 + 52 +7 1</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-014-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-014-ref.xht new file mode 100644 index 00000000000..dc9490b4125 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-014-ref.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orientation-014.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en"/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + .control + { + text-combine-horizontal: none; + } + </style> + </head> + <body lang="en"> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <div class="view_ahem"><span class="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view"><span class="control">123Abc<br/>def456</span></div> + <div class="view"><span class="control">123Abc<br/>def456</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-015-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-015-ref.xht new file mode 100644 index 00000000000..e3688c33e34 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-015-ref.xht @@ -0,0 +1,36 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for text-orientation-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <meta http-equiv="content-language" content="en"/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + .control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + </style> + </head> + <body lang="en"> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong>.</p> + <div class="view_ahem"><span class="control_ahem">36 +25 +1 7</span></div> + <div class="view_ahem"><span class="control_ahem">36 +25 +1 7</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-mixed-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-mixed-001-ref.xht new file mode 100644 index 00000000000..fbbb0898995 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-mixed-001-ref.xht @@ -0,0 +1,29 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + + <style type="text/css"><![CDATA[ + div + { + border: gray solid 1px; + color: blue; + float: left; + margin: 10px; + } + + img { vertical-align: top; } + ]]></style> + </head> + + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: only "T" should be displayed vertically and "ext Sample" should be displayed sideways.</p> + + <div><img src="../support/text-orientation-mixed-001.png" width="42" height="189" alt="Image download support must be enabled"/></div> + + <div><img src="../support/text-orientation-mixed-001.png" width="42" height="189" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-left-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-left-001-ref.xht new file mode 100644 index 00000000000..b4cc24bb94c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-left-001-ref.xht @@ -0,0 +1,28 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + + <style type="text/css"><![CDATA[ + div + { + border: gray solid 1px; + color: blue; + float: left; + margin: 10px; + } + + img {vertical-align: top;} + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees counter-clockwise.</p> + + <div><img src="../support/text-orientation-sideways-left-001.png" width="42" height="187" alt="Image download support must be enabled"/></div> + + <div><img src="../support/text-orientation-sideways-left-001.png" width="42" height="187" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-right-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-right-001-ref.xht new file mode 100644 index 00000000000..5a64c622aee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-sideways-right-001-ref.xht @@ -0,0 +1,28 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + + <style type="text/css"><![CDATA[ + div + { + border: gray solid 1px; + color: blue; + float: left; + margin: 10px; + } + + img {vertical-align: top;} + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees clockwise.</p> + + <div><img src="../support/text-orientation-sideways-right-001.png" width="42" height="187" alt="Image download support must be enabled"/></div> + + <div><img src="../support/text-orientation-sideways-right-001.png" width="42" height="187" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-upright-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-upright-001-ref.xht new file mode 100644 index 00000000000..2fd01110b77 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/text-orientation-upright-001-ref.xht @@ -0,0 +1,29 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + + <style type="text/css"><![CDATA[ + div + { + border: gray solid 1px; + color: blue; + float: left; + margin: 10px; + } + + img {vertical-align: top;} + ]]></style> + </head> + + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed on the upright.</p> + + <div><img src="../support/text-orientation-upright-001.png" width="42" height="349" alt="Image download support must be enabled"/></div> + + <div><img src="../support/text-orientation-upright-001.png" width="42" height="349" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-all-and-inherit-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-all-and-inherit-001-ref.xht new file mode 100644 index 00000000000..66e713f6b6f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-all-and-inherit-001-ref.xht @@ -0,0 +1,34 @@ +<!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: text-combine-upright :all </title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + .tcu-all { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + } + </style> +</head> +<body> + <p>Test passes if the two white triangles are pointing to the right.</p> + <div class="tcu-all"> + <table> + <tbody><tr> + <td> + <div style="display: inline-table"> + <div style="display: inline-block"> + <p>3<span>3</span></p> + </div> + </div> + </td> + </tr> + </tbody></table> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-digit2-and-inherit-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-digit2-and-inherit-001-ref.xht new file mode 100644 index 00000000000..7bcadc7c2c9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/value-digit2-and-inherit-001-ref.xht @@ -0,0 +1,34 @@ +<!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: text-combine-upright :digit2</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + .tcu-all { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + } + </style> +</head> +<body> + <p>Test passes if the two white triangles are pointing to the right.</p> + <div class="tcu-all"> + <table> + <tbody><tr> + <td> + <div style="display: inline-table"> + <div style="display: inline-block"> + <p>3<span>3</span></p> + </div> + </div> + </td> + </tr> + </tbody></table> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x1-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x1-ref.xht new file mode 100644 index 00000000000..9a42110af2f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x1-ref.xht @@ -0,0 +1,26 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>x</p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x3-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x3-ref.xht new file mode 100644 index 00000000000..7563778e83f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x3-ref.xht @@ -0,0 +1,26 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/horizontal-ahem-1x3-notref.xht" rel="mismatch" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxx</p> + <p>xxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x4-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x4-ref.xht new file mode 100644 index 00000000000..c2095e1ee69 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x4-ref.xht @@ -0,0 +1,26 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/horizontal-ahem-1x4-notref.xht" rel="mismatch" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxxx</p> + <p>xxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x5-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x5-ref.xht new file mode 100644 index 00000000000..d234c14c532 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-ahem-1x5-ref.xht @@ -0,0 +1,26 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="reference/horizontal-ahem-1x5-notref.xht" rel="mismatch" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p>xxxxx</p> + <p>xxxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-001-ref.xht new file mode 100644 index 00000000000..e256f5fe620 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-001-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: baseline; + } + img.line { + margin-left: -230px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-004-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-004-ref.xht new file mode 100644 index 00000000000..10dd7c839d0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-004-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: sub; + } + img.line { + margin-left: -230px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + <p class="control"><sub>LLLLLLLLLLLLL</sub> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-007-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-007-ref.xht new file mode 100644 index 00000000000..f77989c9088 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-007-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: super; + } + img.line { + margin-left: -230px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + <p class="control"><sup>LLLLLLLLLLLLL</sup> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-010-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-010-ref.xht new file mode 100644 index 00000000000..f5e5c0d307a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-010-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0em; + } + img.line { + margin-left: -230px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-013-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-013-ref.xht new file mode 100644 index 00000000000..57e001c149f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-013-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0.8em; + } + img.line { + margin-left: -260px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the top 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> + <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> + <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> + <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> + <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> + <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> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-016-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-016-ref.xht new file mode 100644 index 00000000000..5147f7f0f04 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-016-ref.xht @@ -0,0 +1,60 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + padding-bottom: 0.2em; + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: -0.2em; + } + img.line { + margin-left: -260px; + } + ]]></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> + <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> + <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> + <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> + <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> + <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> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-019-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-019-ref.xht new file mode 100644 index 00000000000..07a86405805 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-019-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0%; + } + img.line { + margin-left: -230px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + <p class="control">LLLLLLLLLL + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-022-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-022-ref.xht new file mode 100644 index 00000000000..5bfaf3b22d6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-022-ref.xht @@ -0,0 +1,59 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 80%; + } + img.line { + margin-left: -260px; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the top 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> + <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> + <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> + <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> + <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> + <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> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-025-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-025-ref.xht new file mode 100644 index 00000000000..b95d3c610f3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/vertical-alignment-025-ref.xht @@ -0,0 +1,60 @@ +<!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="Hajime Shiozawa" href="mailto:hajime.shiozawa@gmail.com" /> + <style type="text/css"><![CDATA[ + p.control { + padding-bottom: 0.2em; + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: -20%; + } + img.line { + margin-left: -260px; + } + ]]></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> + <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> + <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> + <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> + <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> + <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> + <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> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001l-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001l-ref.xht new file mode 100644 index 00000000000..73a5e4ba4ac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001l-ref.xht @@ -0,0 +1,22 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<style> +.test { + font-size: 5em; +} +</style> +</head> +<body> + +<p>Test passes if the following texts are identical:</p> + +<div class="test"> + <p>2014</p> + <p>2014</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001r-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001r-ref.xht new file mode 100644 index 00000000000..d1c84d66fe2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-horizontal-001r-ref.xht @@ -0,0 +1,23 @@ +<!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 charset="utf-8" /> +<title>CSS Test Reference</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<style> +.test { + font-size: 5em; + direction: rtl; +} +</style> +</head> +<body> + +<p>Test passes if the following texts are identical:</p> + +<div class="test"> + <p>2014</p> + <p>2014</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-stretch-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-stretch-001-ref.xht new file mode 100644 index 00000000000..25f3929942a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-stretch-001-ref.xht @@ -0,0 +1,18 @@ +<!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>Reference file</title> + <link href="mailto:mitsuteru.s@gmail.com" rel="author" title="Mitsuteru Sawa" /> + <style> + .test { + height: 100px; + width: 250px; + background-color: green; + } + </style> +</head> +<body> + <p>The test passes if you see a green rectangle and no red.</p> + <div class="test"></div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-lr-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-lr-002-ref.xht new file mode 100644 index 00000000000..19b50337f9c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-lr-002-ref.xht @@ -0,0 +1,34 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode - vertical-lr - basic case - reference</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + width: 6em; + white-space: pre; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> +<div>adhjns + i t +be ko +c lqu + f m v + g r</div> +<div>adhjns + i t +be ko +c lqu + f m v + g r</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-001-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-001-ref.xht new file mode 100644 index 00000000000..041ccedfa4d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-001-ref.xht @@ -0,0 +1,34 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode - vertical-rl - basic case - reference</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + width: 6em; + white-space: pre; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> +<div>tomiea + n b +uq jf +v kgc + r l d + s h</div> +<div>tomiea + n b +uq jf +v kgc + r l d + s h</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-002-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-002-ref.xht new file mode 100644 index 00000000000..c94a5a81d7d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-002-ref.xht @@ -0,0 +1,33 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode - vertical-rl - basic case - reference</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + width: 6em; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> +<div>urmiea +vsn x + jf + tokgc + l d + q h</div> +<div>urmiea +vsn x + jf + tokgc + l d + q h</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-003-ref.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-003-ref.xht new file mode 100644 index 00000000000..2264a3ba652 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reference/writing-mode-vertical-rl-003-ref.xht @@ -0,0 +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> + <title>CSS Reftest Reference</title> + <link href="mailto:toshihiro@kisaka.jp" rel="author" title="KISAKA Toshihiro" /> + <style type="text/css"> + div { + writing-mode: vertical-rl; + } + + div p { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + white-space: pre; + width: 6em; + } + + div p:nth-child(2) { + background: pink; + } + </style> +</head> +<body> + <p>Upper three blocks are identical to the lower three blocks including each character positions.</p> + + <div> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + <p> h s +d l r +cgk v + fj qu +b n +aeimot</p> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + </div> + + <div> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + <p> h s +d l r +cgk v + fj qu +b n +aeimot</p> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest-toc.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest-toc.xht new file mode 100644 index 00000000000..6c51c08f66d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest-toc.xht @@ -0,0 +1,3534 @@ + + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Module Level 3 CR Test Suite Reftest Index</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> + + <body> + + <h1>CSS Writing Modes Module Level 3 CR Test Suite Reftest Index</h1> + <table width="100%"> + <col id="test-column"></col> + <col id="ref-column"></col> + <col id="flags-column"></col> + <thead> + <tr> + <th>Test</th> + <th>Reference</th> + <th>Flags</th> + </tr> + </thead> + <tbody id="abs-pos-non-replaced-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-003.xht">abs-pos-non-replaced-vlr-003</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-005.xht">abs-pos-non-replaced-vlr-005</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-007" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-007.xht">abs-pos-non-replaced-vlr-007</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-009" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-009.xht">abs-pos-non-replaced-vlr-009</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-011" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-011.xht">abs-pos-non-replaced-vlr-011</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-013" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vlr-013.xht">abs-pos-non-replaced-vlr-013</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-015" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-015.xht">abs-pos-non-replaced-vlr-015</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-017" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-017.xht">abs-pos-non-replaced-vlr-017</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-019" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-019.xht">abs-pos-non-replaced-vlr-019</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-021" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-021.xht">abs-pos-non-replaced-vlr-021</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-023" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-023.xht">abs-pos-non-replaced-vlr-023</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-025" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-025.xht">abs-pos-non-replaced-vlr-025</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-027" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-027.xht">abs-pos-non-replaced-vlr-027</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-029" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-029.xht">abs-pos-non-replaced-vlr-029</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-031" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-031.xht">abs-pos-non-replaced-vlr-031</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-033" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-033.xht">abs-pos-non-replaced-vlr-033</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-035" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-035.xht">abs-pos-non-replaced-vlr-035</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-037" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-037.xht">abs-pos-non-replaced-vlr-037</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-039" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-039.xht">abs-pos-non-replaced-vlr-039</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-041" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-041.xht">abs-pos-non-replaced-vlr-041</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-043" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-043.xht">abs-pos-non-replaced-vlr-043</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-045" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-045.xht">abs-pos-non-replaced-vlr-045</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-047" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-047.xht">abs-pos-non-replaced-vlr-047</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-049" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vlr-049.xht">abs-pos-non-replaced-vlr-049</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-051" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-051.xht">abs-pos-non-replaced-vlr-051</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-053" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-053.xht">abs-pos-non-replaced-vlr-053</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-055" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-055.xht">abs-pos-non-replaced-vlr-055</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-057" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-057.xht">abs-pos-non-replaced-vlr-057</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-059" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'"> + <a href="abs-pos-non-replaced-vlr-059.xht">abs-pos-non-replaced-vlr-059</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-061" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-061.xht">abs-pos-non-replaced-vlr-061</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-063" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-063.xht">abs-pos-non-replaced-vlr-063</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-065" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-065.xht">abs-pos-non-replaced-vlr-065</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-067" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-067.xht">abs-pos-non-replaced-vlr-067</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-069" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-069.xht">abs-pos-non-replaced-vlr-069</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-071" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-071.xht">abs-pos-non-replaced-vlr-071</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-073" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-073.xht">abs-pos-non-replaced-vlr-073</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-075" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-075.xht">abs-pos-non-replaced-vlr-075</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-077" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-077.xht">abs-pos-non-replaced-vlr-077</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-079" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-079.xht">abs-pos-non-replaced-vlr-079</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-081" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-081.xht">abs-pos-non-replaced-vlr-081</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-083" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-083.xht">abs-pos-non-replaced-vlr-083</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-085" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-085.xht">abs-pos-non-replaced-vlr-085</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-087" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vlr-087.xht">abs-pos-non-replaced-vlr-087</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-089" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vlr-089.xht">abs-pos-non-replaced-vlr-089</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-091" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vlr-091.xht">abs-pos-non-replaced-vlr-091</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-093" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vlr-093.xht">abs-pos-non-replaced-vlr-093</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-095" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-095.xht">abs-pos-non-replaced-vlr-095</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vlr-097" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vlr-097.xht">abs-pos-non-replaced-vlr-097</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-002.xht">abs-pos-non-replaced-vrl-002</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-004.xht">abs-pos-non-replaced-vrl-004</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-006" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-006.xht">abs-pos-non-replaced-vrl-006</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-008" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-008.xht">abs-pos-non-replaced-vrl-008</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-010" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-010.xht">abs-pos-non-replaced-vrl-010</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-012" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are 'auto'"> + <a href="abs-pos-non-replaced-vrl-012.xht">abs-pos-non-replaced-vrl-012</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-014" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' are 'auto' and bottom is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-014.xht">abs-pos-non-replaced-vrl-014</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-016" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'width' are 'auto' and 'right' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-016.xht">abs-pos-non-replaced-vrl-016</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-018" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-018.xht">abs-pos-non-replaced-vrl-018</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-020" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-020.xht">abs-pos-non-replaced-vrl-020</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-022" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'width' are 'auto' and 'right' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-022.xht">abs-pos-non-replaced-vrl-022</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-024" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'height' are 'auto' and 'bottom' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-024.xht">abs-pos-non-replaced-vrl-024</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-026" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-026.xht">abs-pos-non-replaced-vrl-026</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-028" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' and 'right' are 'auto' and 'width' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-028.xht">abs-pos-non-replaced-vrl-028</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-030" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' and 'bottom are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-030.xht">abs-pos-non-replaced-vrl-030</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-032" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-032.xht">abs-pos-non-replaced-vrl-032</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-034" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' and 'right' are 'auto' and 'width' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-034.xht">abs-pos-non-replaced-vrl-034</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-036" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' and 'bottom' are 'auto' and 'height' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-036.xht">abs-pos-non-replaced-vrl-036</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-038" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-038.xht">abs-pos-non-replaced-vrl-038</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-040" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'width' and 'right' are 'auto' and 'left' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-040.xht">abs-pos-non-replaced-vrl-040</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-042" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-042.xht">abs-pos-non-replaced-vrl-042</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-044" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-044.xht">abs-pos-non-replaced-vrl-044</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-046" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'width' and 'right' are 'auto' and 'left' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-046.xht">abs-pos-non-replaced-vrl-046</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-048" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' and 'bottom' are 'auto' and 'top' is not 'auto'"> + <a href="abs-pos-non-replaced-vrl-048.xht">abs-pos-non-replaced-vrl-048</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-050" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-050.xht">abs-pos-non-replaced-vrl-050</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-052" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left' is 'auto', 'width' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-052.xht">abs-pos-non-replaced-vrl-052</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-054" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-054.xht">abs-pos-non-replaced-vrl-054</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-056" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-056.xht">abs-pos-non-replaced-vrl-056</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-058" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left' is 'auto', 'width' and 'right' are not 'auto', then solve for 'left'"> + <a href="abs-pos-non-replaced-vrl-058.xht">abs-pos-non-replaced-vrl-058</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-060" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top' is 'auto' and 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-060.xht">abs-pos-non-replaced-vrl-060</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-062" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-062.xht">abs-pos-non-replaced-vrl-062</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-064" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'width' is 'auto', 'left' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-064.xht">abs-pos-non-replaced-vrl-064</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-066" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-066.xht">abs-pos-non-replaced-vrl-066</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-068" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-068.xht">abs-pos-non-replaced-vrl-068</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-070" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'width' is 'auto', 'left' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-070.xht">abs-pos-non-replaced-vrl-070</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-072" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'height' is 'auto' and 'top' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-072.xht">abs-pos-non-replaced-vrl-072</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-074" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-074.xht">abs-pos-non-replaced-vrl-074</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-076" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'right' is 'auto', 'left' and 'width' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-076.xht">abs-pos-non-replaced-vrl-076</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-078" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-078.xht">abs-pos-non-replaced-vrl-078</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-080" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-080.xht">abs-pos-non-replaced-vrl-080</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-082" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'right' is 'auto', 'left' and 'width' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-082.xht">abs-pos-non-replaced-vrl-082</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-084" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'bottom' is 'auto' and 'top' and 'height' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-084.xht">abs-pos-non-replaced-vrl-084</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-086" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vrl-086.xht">abs-pos-non-replaced-vrl-086</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-088" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'left', 'width' and 'right' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vrl-088.xht">abs-pos-non-replaced-vrl-088</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-090" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: ltr' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vrl-090.xht">abs-pos-non-replaced-vrl-090</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-092" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto' (overconstrained)"> + <a href="abs-pos-non-replaced-vrl-092.xht">abs-pos-non-replaced-vrl-092</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-094" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'left', 'width' and 'right' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-094.xht">abs-pos-non-replaced-vrl-094</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="abs-pos-non-replaced-vrl-096" class="ahem image"> + <tr> + <td rowspan="1" title="absolutely positioned non-replaced element - 'direction: rtl' and 'top', 'height' and 'bottom' are not 'auto'"> + <a href="abs-pos-non-replaced-vrl-096.xht">abs-pos-non-replaced-vrl-096</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="autoheight-regions-in-autoheight-flexbox-002" class="ahem"> + <tr> + <td rowspan="1" title="CSS Regions: Auto-height regions with vertical writing mode in auto-height flexbox"> + <a href="autoheight-regions-in-autoheight-flexbox-002.xht">autoheight-regions-in-autoheight-flexbox-002</a></td> + <td><a href="reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-non-replaced-002" class="ahem"> + <tr> + <td rowspan="1" title="baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'"> + <a href="baseline-inline-non-replaced-002.xht">baseline-inline-non-replaced-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-non-replaced-003" class="ahem"> + <tr> + <td rowspan="1" title="baseline-alignment of empty non-replaced inline-block element and 'vertical-rl'"> + <a href="baseline-inline-non-replaced-003.xht">baseline-inline-non-replaced-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-non-replaced-004" class="ahem"> + <tr> + <td rowspan="1" title="baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'"> + <a href="baseline-inline-non-replaced-004.xht">baseline-inline-non-replaced-004</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-non-replaced-005" class="ahem"> + <tr> + <td rowspan="1" title="baseline-alignment of non-empty non-replaced inline-block element and 'vertical-rl'"> + <a href="baseline-inline-non-replaced-005.xht">baseline-inline-non-replaced-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-replaced-002" class="ahem image"> + <tr> + <td rowspan="1" title="baseline-alignment of inline replaced element and 'vertical-rl'"> + <a href="baseline-inline-replaced-002.xht">baseline-inline-replaced-002</a></td> + <td><a href="reference/baseline-inline-replaced-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="baseline-inline-replaced-003" class="ahem image"> + <tr> + <td rowspan="1" title="baseline-alignment of inline replaced element and 'vertical-lr'"> + <a href="baseline-inline-replaced-003.xht">baseline-inline-replaced-003</a></td> + <td><a href="reference/baseline-inline-replaced-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="bidi-embed-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi embed (1)"> + <a href="bidi-embed-001.xht">bidi-embed-001</a></td> + <td><a href="reference/bidi-embed-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi embed (2)"> + <a href="bidi-embed-002.xht">bidi-embed-002</a></td> + <td><a href="reference/bidi-embed-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi embed (1)"> + <a href="bidi-embed-003.xht">bidi-embed-003</a></td> + <td><a href="reference/bidi-embed-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi embed (2)"> + <a href="bidi-embed-004.xht">bidi-embed-004</a></td> + <td><a href="reference/bidi-embed-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi embed, rtl"> + <a href="bidi-embed-005.xht">bidi-embed-005</a></td> + <td><a href="reference/bidi-embed-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi embed, ltr"> + <a href="bidi-embed-006.xht">bidi-embed-006</a></td> + <td><a href="reference/bidi-embed-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi embed, rtl + number"> + <a href="bidi-embed-007.xht">bidi-embed-007</a></td> + <td><a href="reference/bidi-embed-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi embed, ltr + number"> + <a href="bidi-embed-008.xht">bidi-embed-008</a></td> + <td><a href="reference/bidi-embed-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi embed, rtl list"> + <a href="bidi-embed-009.xht">bidi-embed-009</a></td> + <td><a href="reference/bidi-embed-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi embed, ltr list"> + <a href="bidi-embed-010.xht">bidi-embed-010</a></td> + <td><a href="reference/bidi-embed-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-embed-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: direction alone and inherited, unicode-bidi embed"> + <a href="bidi-embed-011.xht">bidi-embed-011</a></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi isolate (1)"> + <a href="bidi-isolate-001.xht">bidi-isolate-001</a></td> + <td><a href="reference/bidi-isolate-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi isolate (2)"> + <a href="bidi-isolate-002.xht">bidi-isolate-002</a></td> + <td><a href="reference/bidi-isolate-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi isolate (1)"> + <a href="bidi-isolate-003.xht">bidi-isolate-003</a></td> + <td><a href="reference/bidi-isolate-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi isolate (2)"> + <a href="bidi-isolate-004.xht">bidi-isolate-004</a></td> + <td><a href="reference/bidi-isolate-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi isolate, rtl"> + <a href="bidi-isolate-005.xht">bidi-isolate-005</a></td> + <td><a href="reference/bidi-isolate-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi isolate, ltr"> + <a href="bidi-isolate-006.xht">bidi-isolate-006</a></td> + <td><a href="reference/bidi-isolate-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl + number"> + <a href="bidi-isolate-007.xht">bidi-isolate-007</a></td> + <td><a href="reference/bidi-isolate-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr + number"> + <a href="bidi-isolate-008.xht">bidi-isolate-008</a></td> + <td><a href="reference/bidi-isolate-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi isolate, rtl list"> + <a href="bidi-isolate-009.xht">bidi-isolate-009</a></td> + <td><a href="reference/bidi-isolate-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi isolate, ltr list"> + <a href="bidi-isolate-010.xht">bidi-isolate-010</a></td> + <td><a href="reference/bidi-isolate-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: direction alone and inherited, unicode-bidi embed"> + <a href="bidi-isolate-011.xht">bidi-isolate-011</a></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, isolate-override (1)"> + <a href="bidi-isolate-override-001.xht">bidi-isolate-override-001</a></td> + <td><a href="reference/bidi-isolate-override-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, isolate-override (2)"> + <a href="bidi-isolate-override-002.xht">bidi-isolate-override-002</a></td> + <td><a href="reference/bidi-isolate-override-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, isolate-override (1)"> + <a href="bidi-isolate-override-003.xht">bidi-isolate-override-003</a></td> + <td><a href="reference/bidi-isolate-override-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, isolate-override (2)"> + <a href="bidi-isolate-override-004.xht">bidi-isolate-override-004</a></td> + <td><a href="reference/bidi-isolate-override-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with isolate-override, rtl"> + <a href="bidi-isolate-override-005.xht">bidi-isolate-override-005</a></td> + <td><a href="reference/bidi-isolate-override-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with isolate-override, ltr"> + <a href="bidi-isolate-override-006.xht">bidi-isolate-override-006</a></td> + <td><a href="reference/bidi-isolate-override-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and isolate-override, rtl + number"> + <a href="bidi-isolate-override-007.xht">bidi-isolate-override-007</a></td> + <td><a href="reference/bidi-isolate-override-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and isolate-override, ltr + number"> + <a href="bidi-isolate-override-008.xht">bidi-isolate-override-008</a></td> + <td><a href="reference/bidi-isolate-override-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and isolate-override, rtl list"> + <a href="bidi-isolate-override-009.xht">bidi-isolate-override-009</a></td> + <td><a href="reference/bidi-isolate-override-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and isolate-override, ltr list"> + <a href="bidi-isolate-override-010.xht">bidi-isolate-override-010</a></td> + <td><a href="reference/bidi-isolate-override-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: direction alone and inherited, isolate-override"> + <a href="bidi-isolate-override-011.xht">bidi-isolate-override-011</a></td> + <td><a href="reference/bidi-isolate-override-011.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-isolate-override-012" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: default direction, isolate-override"> + <a href="bidi-isolate-override-012.xht">bidi-isolate-override-012</a></td> + <td><a href="reference/bidi-isolate-override-012.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi normal (1)"> + <a href="bidi-normal-001.xht">bidi-normal-001</a></td> + <td><a href="reference/bidi-normal-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi normal (2)"> + <a href="bidi-normal-002.xht">bidi-normal-002</a></td> + <td><a href="reference/bidi-normal-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi normal (1)"> + <a href="bidi-normal-003.xht">bidi-normal-003</a></td> + <td><a href="reference/bidi-normal-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi normal (2)"> + <a href="bidi-normal-004.xht">bidi-normal-004</a></td> + <td><a href="reference/bidi-normal-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi normal, rtl"> + <a href="bidi-normal-005.xht">bidi-normal-005</a></td> + <td><a href="reference/bidi-normal-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi normal, ltr"> + <a href="bidi-normal-006.xht">bidi-normal-006</a></td> + <td><a href="reference/bidi-normal-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi normal, rtl + number"> + <a href="bidi-normal-007.xht">bidi-normal-007</a></td> + <td><a href="reference/bidi-normal-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi normal, ltr + number"> + <a href="bidi-normal-008.xht">bidi-normal-008</a></td> + <td><a href="reference/bidi-normal-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi normal, rtl list"> + <a href="bidi-normal-009.xht">bidi-normal-009</a></td> + <td><a href="reference/bidi-normal-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi normal, ltr list"> + <a href="bidi-normal-010.xht">bidi-normal-010</a></td> + <td><a href="reference/bidi-normal-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-normal-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: direction alone and inherited, unicode-bidi normal"> + <a href="bidi-normal-011.xht">bidi-normal-011</a></td> + <td><a href="reference/bidi-embed-011.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, bidi-override (1)"> + <a href="bidi-override-001.xht">bidi-override-001</a></td> + <td><a href="reference/bidi-override-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, bidi-override (2)"> + <a href="bidi-override-002.xht">bidi-override-002</a></td> + <td><a href="reference/bidi-override-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, bidi-override (1)"> + <a href="bidi-override-003.xht">bidi-override-003</a></td> + <td><a href="reference/bidi-override-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, bidi-override (2)"> + <a href="bidi-override-004.xht">bidi-override-004</a></td> + <td><a href="reference/bidi-override-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with bidi-override, rtl"> + <a href="bidi-override-005.xht">bidi-override-005</a></td> + <td><a href="reference/bidi-override-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with bidi-override, ltr"> + <a href="bidi-override-006.xht">bidi-override-006</a></td> + <td><a href="reference/bidi-override-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and bidi-override, rtl + number"> + <a href="bidi-override-007.xht">bidi-override-007</a></td> + <td><a href="reference/bidi-override-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and bidi-override, ltr + number"> + <a href="bidi-override-008.xht">bidi-override-008</a></td> + <td><a href="reference/bidi-override-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and bidi-override, rtl list"> + <a href="bidi-override-009.xht">bidi-override-009</a></td> + <td><a href="reference/bidi-override-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and bidi-override, ltr list"> + <a href="bidi-override-010.xht">bidi-override-010</a></td> + <td><a href="reference/bidi-override-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: direction alone and inherited, bidi-override"> + <a href="bidi-override-011.xht">bidi-override-011</a></td> + <td><a href="reference/bidi-override-011.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-override-012" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: default direction, bidi-override"> + <a href="bidi-override-012.xht">bidi-override-012</a></td> + <td><a href="reference/bidi-override-012.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-001" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: span unicode-bidi plaintext, rtl (1)"> + <a href="bidi-plaintext-001.xht">bidi-plaintext-001</a></td> + <td><a href="reference/bidi-plaintext-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span unicode-bidi plaintext, rtl (2)"> + <a href="bidi-plaintext-002.xht">bidi-plaintext-002</a></td> + <td><a href="reference/bidi-plaintext-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-003" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: span unicode-bidi plaintext, ltr (1)"> + <a href="bidi-plaintext-003.xht">bidi-plaintext-003</a></td> + <td><a href="reference/bidi-plaintext-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-004" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: span unicode-bidi plaintext, ltr (2)"> + <a href="bidi-plaintext-004.xht">bidi-plaintext-004</a></td> + <td><a href="reference/bidi-plaintext-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-005" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: element as directional character with unicode-bidi plaintext, rtl"> + <a href="bidi-plaintext-005.xht">bidi-plaintext-005</a></td> + <td><a href="reference/bidi-plaintext-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi plaintext, ltr"> + <a href="bidi-plaintext-006.xht">bidi-plaintext-006</a></td> + <td><a href="reference/bidi-plaintext-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-007" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: element isolation and unicode-bidi plaintext, rtl + number"> + <a href="bidi-plaintext-007.xht">bidi-plaintext-007</a></td> + <td><a href="reference/bidi-plaintext-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-008" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: element isolation and unicode-bidi plaintext, ltr + number"> + <a href="bidi-plaintext-008.xht">bidi-plaintext-008</a></td> + <td><a href="reference/bidi-plaintext-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-009" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: element isolation and unicode-bidi plaintext, rtl list"> + <a href="bidi-plaintext-009.xht">bidi-plaintext-009</a></td> + <td><a href="reference/bidi-plaintext-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-010" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: element isolation and unicode-bidi plaintext, ltr list"> + <a href="bidi-plaintext-010.xht">bidi-plaintext-010</a></td> + <td><a href="reference/bidi-plaintext-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-plaintext-011" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span unicode-bidi plaintext, no strong (1)"> + <a href="bidi-plaintext-011.xht">bidi-plaintext-011</a></td> + <td><a href="reference/bidi-plaintext-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-001" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi unset (1)"> + <a href="bidi-unset-001.xht">bidi-unset-001</a></td> + <td><a href="reference/bidi-normal-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-002" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction rtl, unicode-bidi unset (2)"> + <a href="bidi-unset-002.xht">bidi-unset-002</a></td> + <td><a href="reference/bidi-normal-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-003" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi unset (1)"> + <a href="bidi-unset-003.xht">bidi-unset-003</a></td> + <td><a href="reference/bidi-normal-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-004" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: span direction ltr, unicode-bidi unset (2)"> + <a href="bidi-unset-004.xht">bidi-unset-004</a></td> + <td><a href="reference/bidi-normal-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-005" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi unset, rtl"> + <a href="bidi-unset-005.xht">bidi-unset-005</a></td> + <td><a href="reference/bidi-normal-005.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-006" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element as directional character with unicode-bidi unset, ltr"> + <a href="bidi-unset-006.xht">bidi-unset-006</a></td> + <td><a href="reference/bidi-normal-006.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-007" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi unset, rtl + number"> + <a href="bidi-unset-007.xht">bidi-unset-007</a></td> + <td><a href="reference/bidi-normal-007.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-008" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi unset, ltr + number"> + <a href="bidi-unset-008.xht">bidi-unset-008</a></td> + <td><a href="reference/bidi-normal-008.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-009" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi unset, rtl list"> + <a href="bidi-unset-009.xht">bidi-unset-009</a></td> + <td><a href="reference/bidi-normal-009.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="bidi-unset-010" class=""> + <tr> + <td rowspan="1" title="direction/unicode-bidi: element isolation and unicode-bidi unset, ltr list"> + <a href="bidi-unset-010.xht">bidi-unset-010</a></td> + <td><a href="reference/bidi-normal-010.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-embed-001" class=""> + <tr> + <td rowspan="1" title="direction: div direction rtl"> + <a href="block-embed-001.xht">block-embed-001</a></td> + <td><a href="reference/block-embed-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-embed-002" class=""> + <tr> + <td rowspan="1" title="direction: div direction ltr"> + <a href="block-embed-002.xht">block-embed-002</a></td> + <td><a href="reference/block-embed-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-embed-003" class=""> + <tr> + <td rowspan="1" title="direction: div direction rtl"> + <a href="block-embed-003.xht">block-embed-003</a></td> + <td><a href="reference/block-embed-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-flow-direction-001" class="ahem"> + <tr> + <td rowspan="1" title="horizontal-tb - block flow direction of block-level boxes"> + <a href="block-flow-direction-001.xht">block-flow-direction-001</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-002" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - block flow direction of block-level boxes"> + <a href="block-flow-direction-002.xht">block-flow-direction-002</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-003" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - block flow direction of block-level boxes"> + <a href="block-flow-direction-003.xht">block-flow-direction-003</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-004" class="ahem"> + <tr> + <td rowspan="1" title="'writing-mode' - initial value is 'horizontal-tb'"> + <a href="block-flow-direction-004.xht">block-flow-direction-004</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-005" class="ahem"> + <tr> + <td rowspan="1" title="'float: left' and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-005.xht">block-flow-direction-005</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-006" class="ahem"> + <tr> + <td rowspan="1" title="'float: left' and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-006.xht">block-flow-direction-006</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-007" class="ahem"> + <tr> + <td rowspan="1" title="'float: right' and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-007.xht">block-flow-direction-007</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-008" class="ahem"> + <tr> + <td rowspan="1" title="'float: right' and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-008.xht">block-flow-direction-008</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-009" class="ahem"> + <tr> + <td rowspan="1" title="position absolute and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-009.xht">block-flow-direction-009</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-010" class="ahem"> + <tr> + <td rowspan="1" title="position absolute and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-010.xht">block-flow-direction-010</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-011" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-011.xht">block-flow-direction-011</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-012" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-012.xht">block-flow-direction-012</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-013" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-013.xht">block-flow-direction-013</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-014" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-014.xht">block-flow-direction-014</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-015" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-015.xht">block-flow-direction-015</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-016" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-016.xht">block-flow-direction-016</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-017" class="ahem"> + <tr> + <td rowspan="1" title="table-cell and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-017.xht">block-flow-direction-017</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-018" class="ahem"> + <tr> + <td rowspan="1" title="table-cell and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-018.xht">block-flow-direction-018</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-019" class="ahem"> + <tr> + <td rowspan="1" title="table-caption and 'vertical-rl' - block flow direction of block-level boxes"> + <a href="block-flow-direction-019.xht">block-flow-direction-019</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-020" class="ahem"> + <tr> + <td rowspan="1" title="table-caption and 'vertical-lr' - block flow direction of block-level boxes"> + <a href="block-flow-direction-020.xht">block-flow-direction-020</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-021" class="ahem image"> + <tr> + <td rowspan="1" title="list and vertical-rl - block flow direction of block-level boxes"> + <a href="block-flow-direction-021.xht">block-flow-direction-021</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-022" class="ahem image"> + <tr> + <td rowspan="1" title="list and vertical-lr - block flow direction of block-level boxes"> + <a href="block-flow-direction-022.xht">block-flow-direction-022</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-023" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - block flow direction of block-level boxes"> + <a href="block-flow-direction-023.xht">block-flow-direction-023</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-024" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - block flow direction of block-level boxes"> + <a href="block-flow-direction-024.xht">block-flow-direction-024</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="block-flow-direction-025" class="image"> + <tr> + <td rowspan="1" title="writing mode of document - horizontal position of first block"> + <a href="block-flow-direction-025.xht">block-flow-direction-025</a></td> + <td><a href="reference/block-flow-direction-025-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="block-override-001" class=""> + <tr> + <td rowspan="1" title="direction: div override rtl"> + <a href="block-override-001.xht">block-override-001</a></td> + <td><a href="reference/block-override-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-002" class=""> + <tr> + <td rowspan="1" title="direction: div override ltr"> + <a href="block-override-002.xht">block-override-002</a></td> + <td><a href="reference/block-override-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-003" class=""> + <tr> + <td rowspan="1" title="direction: div direction ltr"> + <a href="block-override-003.xht">block-override-003</a></td> + <td><a href="reference/block-override-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-004" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div override inheritance"> + <a href="block-override-004.xht">block-override-004</a></td> + <td><a href="reference/block-override-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-isolate-001" class=""> + <tr> + <td rowspan="1" title="direction: div override rtl"> + <a href="block-override-isolate-001.xht">block-override-isolate-001</a></td> + <td><a href="reference/block-override-isolate-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-isolate-002" class=""> + <tr> + <td rowspan="1" title="direction: div override ltr"> + <a href="block-override-isolate-002.xht">block-override-isolate-002</a></td> + <td><a href="reference/block-override-isolate-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-isolate-003" class=""> + <tr> + <td rowspan="1" title="direction: div direction ltr"> + <a href="block-override-isolate-003.xht">block-override-isolate-003</a></td> + <td><a href="reference/block-override-isolate-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-override-isolate-004" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div override inheritance"> + <a href="block-override-isolate-004.xht">block-override-isolate-004</a></td> + <td><a href="reference/block-override-isolate-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-plaintext-001" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div plaintext, rtl"> + <a href="block-plaintext-001.xht">block-plaintext-001</a></td> + <td><a href="reference/block-plaintext-001.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-plaintext-002" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div plaintext, ltr"> + <a href="block-plaintext-002.xht">block-plaintext-002</a></td> + <td><a href="reference/block-plaintext-002.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-plaintext-003" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div plaintext inheritance"> + <a href="block-plaintext-003.xht">block-plaintext-003</a></td> + <td><a href="reference/block-plaintext-003.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="block-plaintext-004" class=""> + <tr> + <td rowspan="1" title="unicode-bidi: div plaintext with br"> + <a href="block-plaintext-004.xht">block-plaintext-004</a></td> + <td><a href="reference/block-plaintext-004.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="border-spacing-vlr-003" class="ahem"> + <tr> + <td rowspan="1" title="border-spacing - first value is specified and non-zero in 'vertical-lr' table"> + <a href="border-spacing-vlr-003.xht">border-spacing-vlr-003</a></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="border-spacing-vlr-005" class="ahem"> + <tr> + <td rowspan="1" title="border-spacing - second value is specified and non-zero in 'vertical-lr' table"> + <a href="border-spacing-vlr-005.xht">border-spacing-vlr-005</a></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="border-spacing-vrl-002" class="ahem"> + <tr> + <td rowspan="1" title="border-spacing - first value is specified and non-zero in 'vertical-rl' table"> + <a href="border-spacing-vrl-002.xht">border-spacing-vrl-002</a></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="border-spacing-vrl-004" class="ahem"> + <tr> + <td rowspan="1" title="border-spacing - second value is specified and non-zero in 'vertical-rl' table"> + <a href="border-spacing-vrl-004.xht">border-spacing-vrl-004</a></td> + <td><a href="reference/border-spacing-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="border-vlr-007" class="image"> + <tr> + <td rowspan="1" title="border in 'vertical-lr' writing-mode context"> + <a href="border-vlr-007.xht">border-vlr-007</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="border-vrl-006" class="image"> + <tr> + <td rowspan="1" title="border in 'vertical-rl' writing-mode context"> + <a href="border-vrl-006.xht">border-vrl-006</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="box-offsets-rel-pos-vlr-003" class="image"> + <tr> + <td rowspan="1" title="box offsets - position relative"> + <a href="box-offsets-rel-pos-vlr-003.xht">box-offsets-rel-pos-vlr-003</a></td> + <td><a href="reference/abs-pos-non-replaced-vlr-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="box-offsets-rel-pos-vlr-005" class="image"> + <tr> + <td rowspan="1" title="box offsets - relatively positioned boxes"> + <a href="box-offsets-rel-pos-vlr-005.xht">box-offsets-rel-pos-vlr-005</a></td> + <td><a href="reference/box-offsets-rel-pos-vlr-005-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="box-offsets-rel-pos-vrl-002" class="image"> + <tr> + <td rowspan="1" title="box offsets - position relative"> + <a href="box-offsets-rel-pos-vrl-002.xht">box-offsets-rel-pos-vrl-002</a></td> + <td><a href="reference/abs-pos-non-replaced-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="box-offsets-rel-pos-vrl-004" class="image"> + <tr> + <td rowspan="1" title="box offsets - relatively positioned boxes"> + <a href="box-offsets-rel-pos-vrl-004.xht">box-offsets-rel-pos-vrl-004</a></td> + <td><a href="reference/box-offsets-rel-pos-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="central-baseline-alignment-002" class="ahem"> + <tr> + <td rowspan="1" title="central baseline-alignment of text with 'text-orientation: upright' (vertical-rl)"> + <a href="central-baseline-alignment-002.xht">central-baseline-alignment-002</a></td> + <td><a href="reference/central-baseline-alignment-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="central-baseline-alignment-003" class="ahem"> + <tr> + <td rowspan="1" title="central baseline-alignment of text with 'text-orientation: upright' (vertical-lr)"> + <a href="central-baseline-alignment-003.xht">central-baseline-alignment-003</a></td> + <td><a href="reference/central-baseline-alignment-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="clearance-calculations-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="Clearance calculations - clearing box has larger margin than width of float"> + <a href="clearance-calculations-vrl-002.xht">clearance-calculations-vrl-002</a></td> + <td><a href="reference/clearance-calculations-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="clearance-calculations-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="Clearance calculations - clearing box has narrower margin than clearance"> + <a href="clearance-calculations-vrl-004.xht">clearance-calculations-vrl-004</a></td> + <td><a href="reference/clearance-calculations-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="clearance-calculations-vrl-006" class="ahem image"> + <tr> + <td rowspan="1" title="Clearance calculations - clearing box has larger margin than width of float"> + <a href="clearance-calculations-vrl-006.xht">clearance-calculations-vrl-006</a></td> + <td><a href="reference/clearance-calculations-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="clearance-calculations-vrl-008" class="image"> + <tr> + <td rowspan="1" title="clearance calculations"> + <a href="clearance-calculations-vrl-008.xht">clearance-calculations-vrl-008</a></td> + <td><a href="reference/clearance-calculations-vrl-008-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="css-flexbox-row" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row.xht">css-flexbox-row</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="css-flexbox-row-reverse" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row-reverse.xht">css-flexbox-row-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="css-flexbox-row-reverse-wrap" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row-reverse-wrap.xht">css-flexbox-row-reverse-wrap</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="css-flexbox-row-reverse-wrap-reverse" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row-reverse-wrap-reverse.xht">css-flexbox-row-reverse-wrap-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="css-flexbox-row-wrap" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row-wrap.xht">css-flexbox-row-wrap</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="css-flexbox-row-wrap-reverse" class=""> + <tr> + <td rowspan="1" title="flex direction: row, writing mode vertical"> + <a href="css-flexbox-row-wrap-reverse.xht">css-flexbox-row-wrap-reverse</a></td> + <td><a href="reference/css-flexbox-row-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="different-block-flow-dir-001" class=""> + <tr> + <td rowspan="1" title="descendant inline with a different 'writing-mode' value"> + <a href="different-block-flow-dir-001.xht">different-block-flow-dir-001</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="different-block-flow-dir-002" class=""> + <tr> + <td rowspan="1" title="descendant inline with a different 'writing-mode' value"> + <a href="different-block-flow-dir-002.xht">different-block-flow-dir-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="direction-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and 'direction: rtl'"> + <a href="direction-vlr-003.xht">direction-vlr-003</a></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="direction-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and 'direction: ltr'"> + <a href="direction-vlr-005.xht">direction-vlr-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="direction-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and 'direction: rtl'"> + <a href="direction-vrl-002.xht">direction-vrl-002</a></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="direction-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and 'direction: ltr'"> + <a href="direction-vrl-004.xht">direction-vrl-004</a></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="extract-ordered-list-direction-and-writing-modes" class=""> + <tr> + <td rowspan="1" title="flow-into on list items that use different text directions or writing modes"> + <a href="extract-ordered-list-direction-and-writing-modes.xht">extract-ordered-list-direction-and-writing-modes</a></td> + <td><a href="reference/extract-ordered-list-direction-and-writing-modes-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="float-clear-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' and 'clear: right' in 'vertical-lr' block formating context (basic)"> + <a href="float-clear-vlr-003.xht">float-clear-vlr-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'clear: left' in 'vertical-lr' block formating context (basic)"> + <a href="float-clear-vlr-005.xht">float-clear-vlr-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vlr-007" class="image"> + <tr> + <td rowspan="1" title="'float: left' and 'clear: left' in 'vertical-lr' block formating context (intermediate)"> + <a href="float-clear-vlr-007.xht">float-clear-vlr-007</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vlr-009" class="image"> + <tr> + <td rowspan="1" title="'float: right', 'float: left' and 'clear: both' in 'vertical-lr' block formating context (intermediate)"> + <a href="float-clear-vlr-009.xht">float-clear-vlr-009</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' and 'clear: right' in 'vertical-rl' block formating context (basic)"> + <a href="float-clear-vrl-002.xht">float-clear-vrl-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'clear: left' in 'vertical-rl' block formating context (basic)"> + <a href="float-clear-vrl-004.xht">float-clear-vrl-004</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vrl-006" class="image"> + <tr> + <td rowspan="1" title="'float: left' and 'clear: left' in 'vertical-rl' block formating context (intermediate)"> + <a href="float-clear-vrl-006.xht">float-clear-vrl-006</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-clear-vrl-008" class="image"> + <tr> + <td rowspan="1" title="'float: right', 'float: left' and 'clear: both' in 'vertical-rl' block formating context (intermediate)"> + <a href="float-clear-vrl-008.xht">float-clear-vrl-008</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-003" class="image"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes in a 'vertical-lr' block formating context"> + <a href="float-contiguous-vlr-003.xht">float-contiguous-vlr-003</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-005" class="image"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes in a 'vertical-lr' block formating context"> + <a href="float-contiguous-vlr-005.xht">float-contiguous-vlr-005</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-007" class="image"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes in a 'vertical-lr' block formating context"> + <a href="float-contiguous-vlr-007.xht">float-contiguous-vlr-007</a></td> + <td><a href="reference/float-contiguous-vlr-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-009" class="image"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes in a 'vertical-lr' block formating context"> + <a href="float-contiguous-vlr-009.xht">float-contiguous-vlr-009</a></td> + <td><a href="reference/float-contiguous-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-011" class="ahem"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes with 'writing-mode' set to 'vertical-lr'"> + <a href="float-contiguous-vlr-011.xht">float-contiguous-vlr-011</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vlr-013" class="ahem"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes with 'writing-mode' set to 'vertical-lr'"> + <a href="float-contiguous-vlr-013.xht">float-contiguous-vlr-013</a></td> + <td><a href="reference/float-contiguous-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-002" class="image"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes in a 'vertical-rl' block formating context"> + <a href="float-contiguous-vrl-002.xht">float-contiguous-vrl-002</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes in a 'vertical-rl' block formating context"> + <a href="float-contiguous-vrl-004.xht">float-contiguous-vrl-004</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-006" class="image"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes in a 'vertical-rl' block formating context"> + <a href="float-contiguous-vrl-006.xht">float-contiguous-vrl-006</a></td> + <td><a href="reference/float-contiguous-vrl-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-008" class="image"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes in a 'vertical-rl' block formating context"> + <a href="float-contiguous-vrl-008.xht">float-contiguous-vrl-008</a></td> + <td><a href="reference/float-contiguous-vrl-008-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-010" class="ahem"> + <tr> + <td rowspan="1" title="contiguous left-floating boxes with 'writing-mode' set to 'vertical-rl'"> + <a href="float-contiguous-vrl-010.xht">float-contiguous-vrl-010</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-contiguous-vrl-012" class="ahem"> + <tr> + <td rowspan="1" title="contiguous right-floating boxes with 'writing-mode' set to 'vertical-rl'"> + <a href="float-contiguous-vrl-012.xht">float-contiguous-vrl-012</a></td> + <td><a href="reference/float-contiguous-vrl-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vlr-003" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-lr' context"> + <a href="float-shrink-to-fit-vlr-003.xht">float-shrink-to-fit-vlr-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vlr-005" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-lr' context"> + <a href="float-shrink-to-fit-vlr-005.xht">float-shrink-to-fit-vlr-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vlr-007" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-lr' context"> + <a href="float-shrink-to-fit-vlr-007.xht">float-shrink-to-fit-vlr-007</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vlr-009" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-lr' context"> + <a href="float-shrink-to-fit-vlr-009.xht">float-shrink-to-fit-vlr-009</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vrl-002" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-rl' context"> + <a href="float-shrink-to-fit-vrl-002.xht">float-shrink-to-fit-vrl-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vrl-004" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-rl' context"> + <a href="float-shrink-to-fit-vrl-004.xht">float-shrink-to-fit-vrl-004</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vrl-006" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width in 'vertical-rl' context"> + <a href="float-shrink-to-fit-vrl-006.xht">float-shrink-to-fit-vrl-006</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vrl-008" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width (height: auto) in 'vertical-rl' context"> + <a href="float-shrink-to-fit-vrl-008.xht">float-shrink-to-fit-vrl-008</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-shrink-to-fit-vrl-vlr-016" class="ahem"> + <tr> + <td rowspan="1" title="'float' and 'shrink-to-fit' logical width (16 sub-tests)"> + <a href="float-shrink-to-fit-vrl-vlr-016.xht">float-shrink-to-fit-vrl-vlr-016</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-003.xht">float-vlr-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-005.xht">float-vlr-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-007" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-007.xht">float-vlr-007</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-009" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-009.xht">float-vlr-009</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-011" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-011.xht">float-vlr-011</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vlr-013" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'float: right' in a 'vertical-lr' block formating context (basic)"> + <a href="float-vlr-013.xht">float-vlr-013</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-002.xht">float-vrl-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="'float: right' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-004.xht">float-vrl-004</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-006" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-006.xht">float-vrl-006</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-008" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-008.xht">float-vrl-008</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-010" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-010.xht">float-vrl-010</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="float-vrl-012" class="ahem image"> + <tr> + <td rowspan="1" title="'float: left' and 'float: right' in a 'vertical-rl' block formating context (basic)"> + <a href="float-vrl-012.xht">float-vrl-012</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="full-width-001" class=""> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright on full-width characters"> + <a href="full-width-001.xht">full-width-001</a></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="full-width-002" class=""> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright on full-width characters"> + <a href="full-width-002.xht">full-width-002</a></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="full-width-003" class=""> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright on full-width characters"> + <a href="full-width-003.xht">full-width-003</a></td> + <td><a href="reference/full-width-ref.xht">=</a> <a href="reference/full-width-notcu-notref.xht">≠</a> <a href="reference/full-width-horizontal-notref.xht">≠</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="horizontal-rule-vlr-003" class="image"> + <tr> + <td rowspan="1" title="horizontal rule - 'vertical-lr' and orthogonal flow"> + <a href="horizontal-rule-vlr-003.xht">horizontal-rule-vlr-003</a></td> + <td><a href="reference/horizontal-rule-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="horizontal-rule-vlr-005" class=""> + <tr> + <td rowspan="1" title="horizontal rule - 'vertical-lr'"> + <a href="horizontal-rule-vlr-005.xht">horizontal-rule-vlr-005</a></td> + <td><a href="reference/horizontal-rule-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="horizontal-rule-vrl-002" class="image"> + <tr> + <td rowspan="1" title="horizontal rule - 'vertical-rl' and orthogonal flow"> + <a href="horizontal-rule-vrl-002.xht">horizontal-rule-vrl-002</a></td> + <td><a href="reference/horizontal-rule-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="horizontal-rule-vrl-004" class=""> + <tr> + <td rowspan="1" title="horizontal rule - 'vertical-rl'"> + <a href="horizontal-rule-vrl-004.xht">horizontal-rule-vrl-004</a></td> + <td><a href="reference/horizontal-rule-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="inline-block-alignment-001" class="image"> + <tr> + <td rowspan="1" title="inline-block alignment - inline-block with content (alphabetical alignment with horizontal layout)"> + <a href="inline-block-alignment-001.xht">inline-block-alignment-001</a></td> + <td><a href="reference/inline-block-alignment-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="inline-block-alignment-004" class="image"> + <tr> + <td rowspan="1" title="inline-block alignment - inline-block without content (alphabetical alignment with horizontal layout)"> + <a href="inline-block-alignment-004.xht">inline-block-alignment-004</a></td> + <td><a href="reference/inline-block-alignment-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="inline-replaced-vlr-003" class="image"> + <tr> + <td rowspan="1" title="inline replaced element and 'vertical-lr'"> + <a href="inline-replaced-vlr-003.xht">inline-replaced-vlr-003</a></td> + <td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="inline-replaced-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="inline replaced element and 'vertical-lr' (advanced)"> + <a href="inline-replaced-vlr-005.xht">inline-replaced-vlr-005</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="inline-replaced-vrl-002" class="image"> + <tr> + <td rowspan="1" title="inline replaced element and 'vertical-rl'"> + <a href="inline-replaced-vrl-002.xht">inline-replaced-vrl-002</a></td> + <td><a href="reference/inline-replaced-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="inline-replaced-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="inline replaced element and 'vertical-rl' (advanced)"> + <a href="inline-replaced-vrl-004.xht">inline-replaced-vrl-004</a></td> + <td><a href="reference/inline-replaced-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-001" class="ahem"> + <tr> + <td rowspan="1" title="horizontal-tb - ordering direction of line boxes"> + <a href="line-box-direction-001.xht">line-box-direction-001</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-002" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - ordering direction of line boxes"> + <a href="line-box-direction-002.xht">line-box-direction-002</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-003" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - ordering direction of line boxes"> + <a href="line-box-direction-003.xht">line-box-direction-003</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-005" class="ahem"> + <tr> + <td rowspan="1" title="'float: left' and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-005.xht">line-box-direction-005</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-006" class="ahem"> + <tr> + <td rowspan="1" title="'float: left' and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-006.xht">line-box-direction-006</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-007" class="ahem"> + <tr> + <td rowspan="1" title="'float: right' and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-007.xht">line-box-direction-007</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-008" class="ahem"> + <tr> + <td rowspan="1" title="'float: right' and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-008.xht">line-box-direction-008</a></td> + <td><a href="reference/block-flow-direction-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-009" class="ahem"> + <tr> + <td rowspan="1" title="position absolute and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-009.xht">line-box-direction-009</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-010" class="ahem"> + <tr> + <td rowspan="1" title="position absolute and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-010.xht">line-box-direction-010</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-011" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-011.xht">line-box-direction-011</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-012" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-012.xht">line-box-direction-012</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-013" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-013.xht">line-box-direction-013</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-014" class="ahem"> + <tr> + <td rowspan="1" title="inline-block and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-014.xht">line-box-direction-014</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-015" class="ahem"> + <tr> + <td rowspan="1" title="table-cell and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-015.xht">line-box-direction-015</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-016" class="ahem"> + <tr> + <td rowspan="1" title="table-cell and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-016.xht">line-box-direction-016</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-017" class="ahem"> + <tr> + <td rowspan="1" title="table-caption and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-017.xht">line-box-direction-017</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-018" class="ahem"> + <tr> + <td rowspan="1" title="table-caption and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-018.xht">line-box-direction-018</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-019" class="ahem"> + <tr> + <td rowspan="1" title="list and 'vertical-rl' - ordering direction of line boxes"> + <a href="line-box-direction-019.xht">line-box-direction-019</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="line-box-direction-020" class="ahem"> + <tr> + <td rowspan="1" title="list and 'vertical-lr' - ordering direction of line boxes"> + <a href="line-box-direction-020.xht">line-box-direction-020</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - maximum of 2 adjoining margins"> + <a href="margin-collapse-vlr-003.xht">margin-collapse-vlr-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-009" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - adjoining margins of non-siblings or ancestors"> + <a href="margin-collapse-vlr-009.xht">margin-collapse-vlr-009</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-011" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - floated elements do not collapse margins"> + <a href="margin-collapse-vlr-011.xht">margin-collapse-vlr-011</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-015" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - elements with 'overflow' set to 'visible'"> + <a href="margin-collapse-vlr-015.xht">margin-collapse-vlr-015</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-017" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - elements with 'overflow' set to 'hidden'"> + <a href="margin-collapse-vlr-017.xht">margin-collapse-vlr-017</a></td> + <td><a href="reference/ref-if-there-is-no-red.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-025" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - collapse through empty siblings"> + <a href="margin-collapse-vlr-025.xht">margin-collapse-vlr-025</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-031" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - collapse through sibling"> + <a href="margin-collapse-vlr-031.xht">margin-collapse-vlr-031</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-035" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - left margin of a block collapses with left margin of its first child"> + <a href="margin-collapse-vlr-035.xht">margin-collapse-vlr-035</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vlr-037" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-lr' and margin collapsing - right margin of a block collapses with right margin of its last child"> + <a href="margin-collapse-vlr-037.xht">margin-collapse-vlr-037</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - maximum of 2 adjoining margins"> + <a href="margin-collapse-vrl-002.xht">margin-collapse-vrl-002</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-008" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - adjoining margins of non-siblings or ancestors"> + <a href="margin-collapse-vrl-008.xht">margin-collapse-vrl-008</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-010" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - floated elements do not collapse margins"> + <a href="margin-collapse-vrl-010.xht">margin-collapse-vrl-010</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-014" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - elements with 'overflow' set to 'visible'"> + <a href="margin-collapse-vrl-014.xht">margin-collapse-vrl-014</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-016" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - elements with 'overflow' set to 'hidden'"> + <a href="margin-collapse-vrl-016.xht">margin-collapse-vrl-016</a></td> + <td><a href="reference/ref-if-there-is-no-red.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-024" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - collapse through empty siblings"> + <a href="margin-collapse-vrl-024.xht">margin-collapse-vrl-024</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-030" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - collapse through sibling"> + <a href="margin-collapse-vrl-030.xht">margin-collapse-vrl-030</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-034" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - right margin of a block collapses with right margin of its first child"> + <a href="margin-collapse-vrl-034.xht">margin-collapse-vrl-034</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-collapse-vrl-036" class="ahem image"> + <tr> + <td rowspan="1" title="'vertical-rl' and margin collapsing - left margin of a block collapses with left margin of its last child"> + <a href="margin-collapse-vrl-036.xht">margin-collapse-vrl-036</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-vlr-003" class="image"> + <tr> + <td rowspan="1" title="margin in 'vertical-lr' writing-mode context"> + <a href="margin-vlr-003.xht">margin-vlr-003</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="margin-vrl-002" class="image"> + <tr> + <td rowspan="1" title="margin in 'vertical-rl' writing-mode context"> + <a href="margin-vrl-002.xht">margin-vrl-002</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="padding-vlr-005" class="image"> + <tr> + <td rowspan="1" title="padding in 'vertical-lr' writing-mode context"> + <a href="padding-vlr-005.xht">padding-vlr-005</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="padding-vrl-004" class="image"> + <tr> + <td rowspan="1" title="padding in 'vertical-rl' writing-mode context"> + <a href="padding-vrl-004.xht">padding-vrl-004</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-margin-vlr-003" class="image"> + <tr> + <td rowspan="1" title="margin percentage and 'vertical-lr'"> + <a href="percent-margin-vlr-003.xht">percent-margin-vlr-003</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-margin-vlr-005" class="image"> + <tr> + <td rowspan="1" title="margin percentage and 'vertical-lr'"> + <a href="percent-margin-vlr-005.xht">percent-margin-vlr-005</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-margin-vrl-002" class="image"> + <tr> + <td rowspan="1" title="margin percentage and 'vertical-rl'"> + <a href="percent-margin-vrl-002.xht">percent-margin-vrl-002</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-margin-vrl-004" class="image"> + <tr> + <td rowspan="1" title="margin percentage and 'vertical-rl'"> + <a href="percent-margin-vrl-004.xht">percent-margin-vrl-004</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-padding-vlr-003" class="image"> + <tr> + <td rowspan="1" title="padding percentage and 'vertical-lr'"> + <a href="percent-padding-vlr-003.xht">percent-padding-vlr-003</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-padding-vlr-005" class="image"> + <tr> + <td rowspan="1" title="padding percentage and 'vertical-lr'"> + <a href="percent-padding-vlr-005.xht">percent-padding-vlr-005</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-padding-vrl-002" class="image"> + <tr> + <td rowspan="1" title="padding percentage and 'vertical-rl'"> + <a href="percent-padding-vrl-002.xht">percent-padding-vrl-002</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="percent-padding-vrl-004" class="image"> + <tr> + <td rowspan="1" title="padding percentage and 'vertical-rl'"> + <a href="percent-padding-vrl-004.xht">percent-padding-vrl-004</a></td> + <td><a href="reference/margin-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-002" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - table rows progression"> + <a href="row-progression-002.xht">row-progression-002</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-003" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - table rows progression"> + <a href="row-progression-003.xht">row-progression-003</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-004" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - table rows progression and colspan"> + <a href="row-progression-004.xht">row-progression-004</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-005" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - table rows progression and colspan"> + <a href="row-progression-005.xht">row-progression-005</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-006" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - table rows progression and rowspan"> + <a href="row-progression-006.xht">row-progression-006</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-007" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - table rows progression and rowspan"> + <a href="row-progression-007.xht">row-progression-007</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-008" class="ahem"> + <tr> + <td rowspan="1" title="vertical-rl - table rows progression (thead, 2 tbodies, tfoot)"> + <a href="row-progression-008.xht">row-progression-008</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="row-progression-009" class="ahem"> + <tr> + <td rowspan="1" title="vertical-lr - table rows progression (thead, 2 tbodies, tfoot)"> + <a href="row-progression-009.xht">row-progression-009</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="table-column-order-002" class="ahem"> + <tr> + <td rowspan="1" title="'direction: rtl' - table columns order and vertical-rl"> + <a href="table-column-order-002.xht">table-column-order-002</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="table-column-order-003" class="ahem"> + <tr> + <td rowspan="1" title="'direction: rtl' - table columns order and vertical-lr"> + <a href="table-column-order-003.xht">table-column-order-003</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="table-column-order-004" class="ahem"> + <tr> + <td rowspan="1" title="'direction: rtl' - table columns order and vertical-rl"> + <a href="table-column-order-004.xht">table-column-order-004</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="table-column-order-005" class="ahem"> + <tr> + <td rowspan="1" title="'direction: rtl' - table columns order and vertical-lr"> + <a href="table-column-order-005.xht">table-column-order-005</a></td> + <td><a href="reference/block-flow-direction-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-003" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-lr' and 'direction: ltr'"> + <a href="text-align-vlr-003.xht">text-align-vlr-003</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-005" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-lr' and 'direction: rtl'"> + <a href="text-align-vlr-005.xht">text-align-vlr-005</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-007" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-lr' and initial, default 'direction'"> + <a href="text-align-vlr-007.xht">text-align-vlr-007</a></td> + <td><a href="reference/ref-filled-green-100px-square.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-009" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-lr' and 'direction: ltr'"> + <a href="text-align-vlr-009.xht">text-align-vlr-009</a></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-011" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-lr' and 'direction: rtl'"> + <a href="text-align-vlr-011.xht">text-align-vlr-011</a></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-013" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-lr' and initial, default 'direction'"> + <a href="text-align-vlr-013.xht">text-align-vlr-013</a></td> + <td><a href="reference/text-align-vlr-009-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-015" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-lr' and 'direction: ltr'"> + <a href="text-align-vlr-015.xht">text-align-vlr-015</a></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-017" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-lr' and 'direction: rtl'"> + <a href="text-align-vlr-017.xht">text-align-vlr-017</a></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vlr-019" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-lr' and initial, default 'direction'"> + <a href="text-align-vlr-019.xht">text-align-vlr-019</a></td> + <td><a href="reference/direction-vlr-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-002" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-rl' and 'direction: ltr'"> + <a href="text-align-vrl-002.xht">text-align-vrl-002</a></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-004" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-rl' and 'direction: rtl'"> + <a href="text-align-vrl-004.xht">text-align-vrl-004</a></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-006" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: left' - 'vertical-rl' and initial, default 'direction'"> + <a href="text-align-vrl-006.xht">text-align-vrl-006</a></td> + <td><a href="reference/direction-vrl-004-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-008" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-rl' and 'direction: ltr'"> + <a href="text-align-vrl-008.xht">text-align-vrl-008</a></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-010" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-rl' and 'direction: rtl'"> + <a href="text-align-vrl-010.xht">text-align-vrl-010</a></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-012" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: center' - 'vertical-rl' and initial, default 'direction'"> + <a href="text-align-vrl-012.xht">text-align-vrl-012</a></td> + <td><a href="reference/text-align-vrl-008-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-014" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-rl' and 'direction: ltr'"> + <a href="text-align-vrl-014.xht">text-align-vrl-014</a></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-016" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-rl' and 'direction: rtl'"> + <a href="text-align-vrl-016.xht">text-align-vrl-016</a></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-align-vrl-018" class="ahem image"> + <tr> + <td rowspan="1" title="'text-align: right' - 'vertical-rl' and initial, default 'direction'"> + <a href="text-align-vrl-018.xht">text-align-vrl-018</a></td> + <td><a href="reference/direction-vrl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-002" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - central alignment with vertical layout"> + <a href="text-baseline-002.xht">text-baseline-002</a></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-003" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - central alignment with vertical layout"> + <a href="text-baseline-003.xht">text-baseline-003</a></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-004" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - central alignment with vertical layout"> + <a href="text-baseline-004.xht">text-baseline-004</a></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-005" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - central alignment with vertical layout"> + <a href="text-baseline-005.xht">text-baseline-005</a></td> + <td><a href="reference/text-baseline-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-006" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-006.xht">text-baseline-006</a></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-007" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-007.xht">text-baseline-007</a></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-008" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-008.xht">text-baseline-008</a></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-009" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-009.xht">text-baseline-009</a></td> + <td><a href="reference/text-baseline-006-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-010" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-010.xht">text-baseline-010</a></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-baseline-011" class="ahem"> + <tr> + <td rowspan="1" title="text baseline alignment - alphabetical alignment with vertical layout"> + <a href="text-baseline-011.xht">text-baseline-011</a></td> + <td><a href="reference/text-baseline-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-combine-horizontal-010" class="font"> + <tr> + <td rowspan="1" title="text-combine-horizontal - none"> + <a href="text-combine-horizontal-010.xht">text-combine-horizontal-010</a></td> + <td><a href="reference/text-combine-horizontal-010-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr></td> + </tr> + </tbody> + <tbody id="text-combine-horizontal-011" class="font"> + <tr> + <td rowspan="1" title="text-combine-horizontal - all"> + <a href="text-combine-horizontal-011.xht">text-combine-horizontal-011</a></td> + <td><a href="reference/text-combine-horizontal-011-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr></td> + </tr> + </tbody> + <tbody id="text-decoration-001" class=""> + <tr> + <td rowspan="1" title="text-combine-upright with text-decoration"> + <a href="text-decoration-001.xht">text-decoration-001</a></td> + <td><a href="reference/text-decoration-001-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="text-emphasis-001" class=""> + <tr> + <td rowspan="1" title="text-combine-upright with text-emphasis"> + <a href="text-emphasis-001.xht">text-emphasis-001</a></td> + <td><a href="reference/text-emphasis-001-ref.xht">=</a> <a href="reference/reference/text-emphasis-001-notref.xht">≠</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="text-orientation-010" class="ahem font"> + <tr> + <td rowspan="1" title="text-orientation - mixed"> + <a href="text-orientation-010.xht">text-orientation-010</a></td> + <td><a href="reference/text-orientation-010-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="font" title="Requires a special font">Font</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-011" class="ahem font"> + <tr> + <td rowspan="1" title="text-orientation - upright"> + <a href="text-orientation-011.xht">text-orientation-011</a></td> + <td><a href="reference/text-orientation-011-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="font" title="Requires a special font">Font</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-012" class="ahem"> + <tr> + <td rowspan="1" title="text-orientation - sideways-right"> + <a href="text-orientation-012.xht">text-orientation-012</a></td> + <td><a href="reference/text-orientation-012-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-013" class="ahem"> + <tr> + <td rowspan="1" title="text-orientation - sideways-left"> + <a href="text-orientation-013.xht">text-orientation-013</a></td> + <td><a href="reference/text-orientation-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-014" class="ahem"> + <tr> + <td rowspan="1" title="text-orientation - sideways"> + <a href="text-orientation-014.xht">text-orientation-014</a></td> + <td><a href="reference/text-orientation-014-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-015" class="ahem"> + <tr> + <td rowspan="1" title="text-orientation - sideways"> + <a href="text-orientation-015.xht">text-orientation-015</a></td> + <td><a href="reference/text-orientation-015-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-mixed-001" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - mixed in vertical-rl writing mode"> + <a href="text-orientation-mixed-001.xht">text-orientation-mixed-001</a></td> + <td><a href="reference/text-orientation-mixed-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-sideways-001" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - sideways in vertical-rl writing mode"> + <a href="text-orientation-sideways-001.xht">text-orientation-sideways-001</a></td> + <td><a href="reference/text-orientation-sideways-right-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-sideways-002" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - sideways in vertical-lr writing mode"> + <a href="text-orientation-sideways-002.xht">text-orientation-sideways-002</a></td> + <td><a href="reference/text-orientation-sideways-left-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-sideways-left-001" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - sideways-left in vertical-rl writing mode"> + <a href="text-orientation-sideways-left-001.xht">text-orientation-sideways-left-001</a></td> + <td><a href="reference/text-orientation-sideways-left-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-sideways-right-001" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - sideways-right in vertical-rl writing mode"> + <a href="text-orientation-sideways-right-001.xht">text-orientation-sideways-right-001</a></td> + <td><a href="reference/text-orientation-sideways-right-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="text-orientation-upright-001" class="font image"> + <tr> + <td rowspan="1" title="text-orientation - upright in vertical-rl writing mode"> + <a href="text-orientation-upright-001.xht">text-orientation-upright-001</a></td> + <td><a href="reference/text-orientation-upright-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="font" title="Requires a special font">Font</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="value-all-002" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: all"> + <a href="value-all-002.xht">value-all-002</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-all-003" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: all"> + <a href="value-all-003.xht">value-all-003</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-all-and-inherit-001" class=""> + <tr> + <td rowspan="1" title="text-combine-upright :all"> + <a href="value-all-and-inherit-001.xht">value-all-and-inherit-001</a></td> + <td><a href="reference/value-all-and-inherit-001-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="value-digit2-and-inherit-001" class=""> + <tr> + <td rowspan="1" title="text-combine-upright :digit2"> + <a href="value-digit2-and-inherit-001.xht">value-digit2-and-inherit-001</a></td> + <td><a href="reference/value-digit2-and-inherit-001-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="value-digits2-002" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 2 + two digits"> + <a href="value-digits2-002.xht">value-digits2-002</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits2-003" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 2 + three digits"> + <a href="value-digits2-003.xht">value-digits2-003</a></td> + <td><a href="reference/vertical-ahem-1x3-ref.xht">=</a> <a href="reference/horizontal-ahem-1x3-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits3-001" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 3 + two digits"> + <a href="value-digits3-001.xht">value-digits3-001</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits3-002" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 3 + three digits"> + <a href="value-digits3-002.xht">value-digits3-002</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits3-003" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 3 + four digits"> + <a href="value-digits3-003.xht">value-digits3-003</a></td> + <td><a href="reference/vertical-ahem-1x4-ref.xht">=</a> <a href="reference/horizontal-ahem-1x4-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits4-001" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 4 + three digits"> + <a href="value-digits4-001.xht">value-digits4-001</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits4-002" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 4 + four digits"> + <a href="value-digits4-002.xht">value-digits4-002</a></td> + <td><a href="reference/vertical-ahem-1x1-ref.xht">=</a> <a href="reference/horizontal-ahem-1x1-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-digits4-003" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: digits 4 + five digits"> + <a href="value-digits4-003.xht">value-digits4-003</a></td> + <td><a href="reference/vertical-ahem-1x5-ref.xht">=</a> <a href="reference/horizontal-ahem-1x5-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="value-none-001" class="ahem"> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright: none"> + <a href="value-none-001.xht">value-none-001</a></td> + <td><a href="reference/vertical-ahem-1x3-ref.xht">=</a> <a href="reference/horizontal-ahem-1x3-notref.xht">≠</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-001" class="image"> + <tr> + <td rowspan="1" title="vertical align - 'baseline' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-001.xht">vertical-alignment-001</a></td> + <td><a href="reference/vertical-alignment-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-004" class="image"> + <tr> + <td rowspan="1" title="vertical align - 'sub' (alphabetical baseline with horizontal layout)"> + <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="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-007" class="image"> + <tr> + <td rowspan="1" title="vertical align - 'super' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-007.xht">vertical-alignment-007</a></td> + <td><a href="reference/vertical-alignment-007-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-010" class="image"> + <tr> + <td rowspan="1" title="vertical align - 'zero length (0em)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-010.xht">vertical-alignment-010</a></td> + <td><a href="reference/vertical-alignment-010-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-013" class="ahem image"> + <tr> + <td rowspan="1" title="vertical align - 'positive length (0.8em)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-013.xht">vertical-alignment-013</a></td> + <td><a href="reference/vertical-alignment-013-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-016" class="ahem image"> + <tr> + <td rowspan="1" title="vertical align - 'negative length (-0.2em)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-016.xht">vertical-alignment-016</a></td> + <td><a href="reference/vertical-alignment-016-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-019" class="image"> + <tr> + <td rowspan="1" title="vertical align - 'zero percentage (0%)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-019.xht">vertical-alignment-019</a></td> + <td><a href="reference/vertical-alignment-019-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-022" class="ahem image"> + <tr> + <td rowspan="1" title="vertical align - 'positive percentage (80%)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-022.xht">vertical-alignment-022</a></td> + <td><a href="reference/vertical-alignment-022-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="vertical-alignment-025" class="ahem image"> + <tr> + <td rowspan="1" title="vertical align - 'negative percent (-20%)' (alphabetical baseline with horizontal layout)"> + <a href="vertical-alignment-025.xht">vertical-alignment-025</a></td> + <td><a href="reference/vertical-alignment-025-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td> + </tr> + </tbody> + <tbody id="writing-mode-horizontal-001l" class=""> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright in horizontal writing mode"> + <a href="writing-mode-horizontal-001l.xht">writing-mode-horizontal-001l</a></td> + <td><a href="reference/writing-mode-horizontal-001l-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="writing-mode-horizontal-001r" class=""> + <tr> + <td rowspan="1" title="CSS Writing Modes: text-combine-upright in horizontal writing mode"> + <a href="writing-mode-horizontal-001r.xht">writing-mode-horizontal-001r</a></td> + <td><a href="reference/writing-mode-horizontal-001r-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="writing-mode-stretch-001" class=""> + <tr> + <td rowspan="1" title="writing-mode vertical-lr and vertical-rl"> + <a href="writing-mode-stretch-001.xht">writing-mode-stretch-001</a></td> + <td><a href="reference/writing-mode-stretch-001-ref.xht">=</a> </td> + <td rowspan="1"></td> + </tr> + </tbody> + <tbody id="writing-mode-vertical-lr-002" class="ahem"> + <tr> + <td rowspan="1" title="writing-mode: vertical-lr - basic inline case"> + <a href="writing-mode-vertical-lr-002.xht">writing-mode-vertical-lr-002</a></td> + <td><a href="reference/writing-mode-vertical-lr-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="writing-mode-vertical-rl-001" class="ahem"> + <tr> + <td rowspan="1" title="writing-mode: vertical-rl - basic inline case"> + <a href="writing-mode-vertical-rl-001.xht">writing-mode-vertical-rl-001</a></td> + <td><a href="reference/writing-mode-vertical-rl-001-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="writing-mode-vertical-rl-002" class="ahem"> + <tr> + <td rowspan="1" title="writing-mode: vertical-rl - basic inline case"> + <a href="writing-mode-vertical-rl-002.xht">writing-mode-vertical-rl-002</a></td> + <td><a href="reference/writing-mode-vertical-rl-002-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + <tbody id="writing-mode-vertical-rl-003" class="ahem"> + <tr> + <td rowspan="1" title="writing-mode: horizontal-tb nested in vertical-rl"> + <a href="writing-mode-vertical-rl-003.xht">writing-mode-vertical-rl-003</a></td> + <td><a href="reference/writing-mode-vertical-rl-003-ref.xht">=</a> </td> + <td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td> + </tr> + </tbody> + </table> + + </body> +</html> diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest.list b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest.list new file mode 100644 index 00000000000..8689cff24df --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/reftest.list @@ -0,0 +1,439 @@ + +abs-pos-non-replaced-vlr-003.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-005.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-007.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-009.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-011.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-013.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-015.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-017.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-019.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-021.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-023.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-025.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-027.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-029.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-031.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-033.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-035.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-037.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-039.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-041.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-043.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-045.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-047.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-049.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-051.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-053.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-055.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-057.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-059.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-061.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-063.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-065.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-067.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-069.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-071.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-073.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-075.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-077.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-079.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-081.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-083.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-085.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vlr-087.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vlr-089.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vlr-091.xht == reference/abs-pos-non-replaced-vlr-007-ref.xht +abs-pos-non-replaced-vlr-093.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-095.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vlr-097.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +abs-pos-non-replaced-vrl-002.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-004.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-006.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-008.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-010.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-012.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-014.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-016.xht == reference/abs-pos-non-replaced-vlr-003-ref.xht +abs-pos-non-replaced-vrl-018.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-020.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-022.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-024.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-026.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-028.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-030.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-032.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht-ref.xht +abs-pos-non-replaced-vrl-034.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-036.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-038.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-040.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-042.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-044.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-046.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-048.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-050.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-052.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-054.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-056.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-058.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-060.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-062.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-064.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-066.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-068.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-070.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-072.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-074.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-076.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-078.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-080.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-082.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-084.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +abs-pos-non-replaced-vrl-086.xht == reference/abs-pos-non-replaced-vrl-002-ref.xht +abs-pos-non-replaced-vrl-088.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-090.xht == reference/abs-pos-non-replaced-vrl-006-ref.xht +abs-pos-non-replaced-vrl-092.xht == reference/abs-pos-non-replaced-vrl-004-ref.xht +abs-pos-non-replaced-vrl-094.xht == reference/abs-pos-non-replaced-vlr-009-ref.xht +abs-pos-non-replaced-vrl-096.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +autoheight-regions-in-autoheight-flexbox-002.xht == reference/autoheight-regions-in-autoheight-flexbox-002-ref.xht +baseline-inline-non-replaced-002.xht == reference/ref-filled-green-100px-square.xht +baseline-inline-non-replaced-003.xht == reference/ref-filled-green-100px-square.xht +baseline-inline-non-replaced-004.xht == reference/ref-filled-green-100px-square.xht +baseline-inline-non-replaced-005.xht == reference/ref-filled-green-100px-square.xht +baseline-inline-replaced-002.xht == reference/baseline-inline-replaced-002-ref.xht +baseline-inline-replaced-003.xht == reference/baseline-inline-replaced-002-ref.xht +bidi-embed-001.xht == reference/bidi-embed-001.xht +bidi-embed-002.xht == reference/bidi-embed-002.xht +bidi-embed-003.xht == reference/bidi-embed-003.xht +bidi-embed-004.xht == reference/bidi-embed-004.xht +bidi-embed-005.xht == reference/bidi-embed-005.xht +bidi-embed-006.xht == reference/bidi-embed-006.xht +bidi-embed-007.xht == reference/bidi-embed-007.xht +bidi-embed-008.xht == reference/bidi-embed-008.xht +bidi-embed-009.xht == reference/bidi-embed-009.xht +bidi-embed-010.xht == reference/bidi-embed-010.xht +bidi-embed-011.xht == reference/bidi-embed-011.xht +bidi-isolate-001.xht == reference/bidi-isolate-001.xht +bidi-isolate-002.xht == reference/bidi-isolate-002.xht +bidi-isolate-003.xht == reference/bidi-isolate-003.xht +bidi-isolate-004.xht == reference/bidi-isolate-004.xht +bidi-isolate-005.xht == reference/bidi-isolate-005.xht +bidi-isolate-006.xht == reference/bidi-isolate-006.xht +bidi-isolate-007.xht == reference/bidi-isolate-007.xht +bidi-isolate-008.xht == reference/bidi-isolate-008.xht +bidi-isolate-009.xht == reference/bidi-isolate-009.xht +bidi-isolate-010.xht == reference/bidi-isolate-010.xht +bidi-isolate-011.xht == reference/bidi-embed-011.xht +bidi-isolate-override-001.xht == reference/bidi-isolate-override-001.xht +bidi-isolate-override-002.xht == reference/bidi-isolate-override-002.xht +bidi-isolate-override-003.xht == reference/bidi-isolate-override-003.xht +bidi-isolate-override-004.xht == reference/bidi-isolate-override-004.xht +bidi-isolate-override-005.xht == reference/bidi-isolate-override-005.xht +bidi-isolate-override-006.xht == reference/bidi-isolate-override-006.xht +bidi-isolate-override-007.xht == reference/bidi-isolate-override-007.xht +bidi-isolate-override-008.xht == reference/bidi-isolate-override-008.xht +bidi-isolate-override-009.xht == reference/bidi-isolate-override-009.xht +bidi-isolate-override-010.xht == reference/bidi-isolate-override-010.xht +bidi-isolate-override-011.xht == reference/bidi-isolate-override-011.xht +bidi-isolate-override-012.xht == reference/bidi-isolate-override-012.xht +bidi-normal-001.xht == reference/bidi-normal-001.xht +bidi-normal-002.xht == reference/bidi-normal-002.xht +bidi-normal-003.xht == reference/bidi-normal-003.xht +bidi-normal-004.xht == reference/bidi-normal-004.xht +bidi-normal-005.xht == reference/bidi-normal-005.xht +bidi-normal-006.xht == reference/bidi-normal-006.xht +bidi-normal-007.xht == reference/bidi-normal-007.xht +bidi-normal-008.xht == reference/bidi-normal-008.xht +bidi-normal-009.xht == reference/bidi-normal-009.xht +bidi-normal-010.xht == reference/bidi-normal-010.xht +bidi-normal-011.xht == reference/bidi-embed-011.xht +bidi-override-001.xht == reference/bidi-override-001.xht +bidi-override-002.xht == reference/bidi-override-002.xht +bidi-override-003.xht == reference/bidi-override-003.xht +bidi-override-004.xht == reference/bidi-override-004.xht +bidi-override-005.xht == reference/bidi-override-005.xht +bidi-override-006.xht == reference/bidi-override-006.xht +bidi-override-007.xht == reference/bidi-override-007.xht +bidi-override-008.xht == reference/bidi-override-008.xht +bidi-override-009.xht == reference/bidi-override-009.xht +bidi-override-010.xht == reference/bidi-override-010.xht +bidi-override-011.xht == reference/bidi-override-011.xht +bidi-override-012.xht == reference/bidi-override-012.xht +bidi-plaintext-001.xht == reference/bidi-plaintext-001.xht +bidi-plaintext-002.xht == reference/bidi-plaintext-002.xht +bidi-plaintext-003.xht == reference/bidi-plaintext-003.xht +bidi-plaintext-004.xht == reference/bidi-plaintext-004.xht +bidi-plaintext-005.xht == reference/bidi-plaintext-005.xht +bidi-plaintext-006.xht == reference/bidi-plaintext-006.xht +bidi-plaintext-007.xht == reference/bidi-plaintext-007.xht +bidi-plaintext-008.xht == reference/bidi-plaintext-008.xht +bidi-plaintext-009.xht == reference/bidi-plaintext-009.xht +bidi-plaintext-010.xht == reference/bidi-plaintext-010.xht +bidi-plaintext-011.xht == reference/bidi-plaintext-002.xht +bidi-unset-001.xht == reference/bidi-normal-001.xht +bidi-unset-002.xht == reference/bidi-normal-002.xht +bidi-unset-003.xht == reference/bidi-normal-003.xht +bidi-unset-004.xht == reference/bidi-normal-004.xht +bidi-unset-005.xht == reference/bidi-normal-005.xht +bidi-unset-006.xht == reference/bidi-normal-006.xht +bidi-unset-007.xht == reference/bidi-normal-007.xht +bidi-unset-008.xht == reference/bidi-normal-008.xht +bidi-unset-009.xht == reference/bidi-normal-009.xht +bidi-unset-010.xht == reference/bidi-normal-010.xht +block-embed-001.xht == reference/block-embed-001.xht +block-embed-002.xht == reference/block-embed-002.xht +block-embed-003.xht == reference/block-embed-003.xht +block-flow-direction-001.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-002.xht == reference/block-flow-direction-002-ref.xht +block-flow-direction-003.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-004.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-005.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-006.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-007.xht == reference/block-flow-direction-002-ref.xht +block-flow-direction-008.xht == reference/block-flow-direction-002-ref.xht +block-flow-direction-009.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-010.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-011.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-012.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-013.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-014.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-015.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-016.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-017.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-018.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-019.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-020.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-021.xht == reference/block-flow-direction-002-ref.xht +block-flow-direction-022.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-023.xht == reference/block-flow-direction-001-ref.xht +block-flow-direction-024.xht == reference/block-flow-direction-002-ref.xht +block-flow-direction-025.xht == reference/block-flow-direction-025-ref.xht +block-override-001.xht == reference/block-override-001.xht +block-override-002.xht == reference/block-override-002.xht +block-override-003.xht == reference/block-override-003.xht +block-override-004.xht == reference/block-override-004.xht +block-override-isolate-001.xht == reference/block-override-isolate-001.xht +block-override-isolate-002.xht == reference/block-override-isolate-002.xht +block-override-isolate-003.xht == reference/block-override-isolate-003.xht +block-override-isolate-004.xht == reference/block-override-isolate-004.xht +block-plaintext-001.xht == reference/block-plaintext-001.xht +block-plaintext-002.xht == reference/block-plaintext-002.xht +block-plaintext-003.xht == reference/block-plaintext-003.xht +block-plaintext-004.xht == reference/block-plaintext-004.xht +border-spacing-vlr-003.xht == reference/border-spacing-vrl-002-ref.xht +border-spacing-vlr-005.xht == reference/border-spacing-vrl-002-ref.xht +border-spacing-vrl-002.xht == reference/border-spacing-vrl-002-ref.xht +border-spacing-vrl-004.xht == reference/border-spacing-vrl-002-ref.xht +border-vlr-007.xht == reference/margin-vrl-002-ref.xht +border-vrl-006.xht == reference/margin-vrl-002-ref.xht +box-offsets-rel-pos-vlr-003.xht == reference/abs-pos-non-replaced-vlr-013-ref.xht +box-offsets-rel-pos-vlr-005.xht == reference/box-offsets-rel-pos-vlr-005-ref.xht +box-offsets-rel-pos-vrl-002.xht == reference/abs-pos-non-replaced-vrl-012-ref.xht +box-offsets-rel-pos-vrl-004.xht == reference/box-offsets-rel-pos-vrl-004-ref.xht +central-baseline-alignment-002.xht == reference/central-baseline-alignment-002-ref.xht +central-baseline-alignment-003.xht == reference/central-baseline-alignment-002-ref.xht +clearance-calculations-vrl-002.xht == reference/clearance-calculations-vrl-002-ref.xht +clearance-calculations-vrl-004.xht == reference/clearance-calculations-vrl-004-ref.xht +clearance-calculations-vrl-006.xht == reference/clearance-calculations-vrl-006-ref.xht +clearance-calculations-vrl-008.xht == reference/clearance-calculations-vrl-008-ref.xht +css-flexbox-row.xht == reference/css-flexbox-row-ref.xht +css-flexbox-row-reverse.xht == reference/css-flexbox-row-ref.xht +css-flexbox-row-reverse-wrap.xht == reference/css-flexbox-row-ref.xht +css-flexbox-row-reverse-wrap-reverse.xht == reference/css-flexbox-row-ref.xht +css-flexbox-row-wrap.xht == reference/css-flexbox-row-ref.xht +css-flexbox-row-wrap-reverse.xht == reference/css-flexbox-row-ref.xht +different-block-flow-dir-001.xht == reference/ref-filled-green-100px-square.xht +different-block-flow-dir-002.xht == reference/ref-filled-green-100px-square.xht +direction-vlr-003.xht == reference/direction-vlr-003-ref.xht +direction-vlr-005.xht == reference/ref-filled-green-100px-square.xht +direction-vrl-002.xht == reference/direction-vrl-002-ref.xht +direction-vrl-004.xht == reference/direction-vrl-004-ref.xht +extract-ordered-list-direction-and-writing-modes.xht == reference/extract-ordered-list-direction-and-writing-modes-ref.xht +float-clear-vlr-003.xht == reference/ref-filled-green-100px-square.xht +float-clear-vlr-005.xht == reference/ref-filled-green-100px-square.xht +float-clear-vlr-007.xht == reference/ref-filled-green-100px-square.xht +float-clear-vlr-009.xht == reference/ref-filled-green-100px-square.xht +float-clear-vrl-002.xht == reference/ref-filled-green-100px-square.xht +float-clear-vrl-004.xht == reference/ref-filled-green-100px-square.xht +float-clear-vrl-006.xht == reference/ref-filled-green-100px-square.xht +float-clear-vrl-008.xht == reference/ref-filled-green-100px-square.xht +float-contiguous-vlr-003.xht == reference/inline-replaced-vrl-004-ref.xht +float-contiguous-vlr-005.xht == reference/inline-replaced-vrl-004-ref.xht +float-contiguous-vlr-007.xht == reference/float-contiguous-vlr-007-ref.xht +float-contiguous-vlr-009.xht == reference/float-contiguous-vlr-009-ref.xht +float-contiguous-vlr-011.xht == reference/ref-filled-green-100px-square.xht +float-contiguous-vlr-013.xht == reference/float-contiguous-vrl-012-ref.xht +float-contiguous-vrl-002.xht == reference/inline-replaced-vrl-004-ref.xht +float-contiguous-vrl-004.xht == reference/inline-replaced-vrl-004-ref.xht +float-contiguous-vrl-006.xht == reference/float-contiguous-vrl-006-ref.xht +float-contiguous-vrl-008.xht == reference/float-contiguous-vrl-008-ref.xht +float-contiguous-vrl-010.xht == reference/ref-filled-green-100px-square.xht +float-contiguous-vrl-012.xht == reference/float-contiguous-vrl-012-ref.xht +float-shrink-to-fit-vlr-003.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vlr-005.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vlr-007.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vlr-009.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vrl-002.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vrl-004.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vrl-006.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vrl-008.xht == reference/ref-filled-green-100px-square.xht +float-shrink-to-fit-vrl-vlr-016.xht == reference/ref-filled-green-100px-square.xht +float-vlr-003.xht == reference/ref-filled-green-100px-square.xht +float-vlr-005.xht == reference/ref-filled-green-100px-square.xht +float-vlr-007.xht == reference/ref-filled-green-100px-square.xht +float-vlr-009.xht == reference/ref-filled-green-100px-square.xht +float-vlr-011.xht == reference/ref-filled-green-100px-square.xht +float-vlr-013.xht == reference/ref-filled-green-100px-square.xht +float-vrl-002.xht == reference/ref-filled-green-100px-square.xht +float-vrl-004.xht == reference/ref-filled-green-100px-square.xht +float-vrl-006.xht == reference/ref-filled-green-100px-square.xht +float-vrl-008.xht == reference/ref-filled-green-100px-square.xht +float-vrl-010.xht == reference/ref-filled-green-100px-square.xht +float-vrl-012.xht == reference/ref-filled-green-100px-square.xht +full-width-001.xht == reference/full-width-ref.xht != reference/full-width-notcu-notref.xht != reference/full-width-horizontal-notref.xht +full-width-002.xht == reference/full-width-ref.xht != reference/full-width-notcu-notref.xht != reference/full-width-horizontal-notref.xht +full-width-003.xht == reference/full-width-ref.xht != reference/full-width-notcu-notref.xht != reference/full-width-horizontal-notref.xht +horizontal-rule-vlr-003.xht == reference/horizontal-rule-vlr-003-ref.xht +horizontal-rule-vlr-005.xht == reference/horizontal-rule-vrl-004-ref.xht +horizontal-rule-vrl-002.xht == reference/horizontal-rule-vrl-002-ref.xht +horizontal-rule-vrl-004.xht == reference/horizontal-rule-vrl-004-ref.xht +inline-block-alignment-001.xht == reference/inline-block-alignment-001-ref.xht +inline-block-alignment-004.xht == reference/inline-block-alignment-004-ref.xht +inline-replaced-vlr-003.xht == reference/inline-replaced-vrl-002-ref.xht +inline-replaced-vlr-005.xht == reference/inline-replaced-vrl-004-ref.xht +inline-replaced-vrl-002.xht == reference/inline-replaced-vrl-002-ref.xht +inline-replaced-vrl-004.xht == reference/inline-replaced-vrl-004-ref.xht +line-box-direction-001.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-002.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-003.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-005.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-006.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-007.xht == reference/block-flow-direction-002-ref.xht +line-box-direction-008.xht == reference/block-flow-direction-002-ref.xht +line-box-direction-009.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-010.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-011.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-012.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-013.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-014.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-015.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-016.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-017.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-018.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-019.xht == reference/block-flow-direction-001-ref.xht +line-box-direction-020.xht == reference/block-flow-direction-001-ref.xht +margin-collapse-vlr-003.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-009.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-011.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-015.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-017.xht == reference/ref-if-there-is-no-red.xht +margin-collapse-vlr-025.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-031.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-035.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vlr-037.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-002.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-008.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-010.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-014.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-016.xht == reference/ref-if-there-is-no-red.xht +margin-collapse-vrl-024.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-030.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-034.xht == reference/ref-filled-green-100px-square.xht +margin-collapse-vrl-036.xht == reference/ref-filled-green-100px-square.xht +margin-vlr-003.xht == reference/margin-vrl-002-ref.xht +margin-vrl-002.xht == reference/margin-vrl-002-ref.xht +padding-vlr-005.xht == reference/margin-vrl-002-ref.xht +padding-vrl-004.xht == reference/margin-vrl-002-ref.xht +percent-margin-vlr-003.xht == reference/margin-vrl-002-ref.xht +percent-margin-vlr-005.xht == reference/margin-vrl-002-ref.xht +percent-margin-vrl-002.xht == reference/margin-vrl-002-ref.xht +percent-margin-vrl-004.xht == reference/margin-vrl-002-ref.xht +percent-padding-vlr-003.xht == reference/margin-vrl-002-ref.xht +percent-padding-vlr-005.xht == reference/margin-vrl-002-ref.xht +percent-padding-vrl-002.xht == reference/margin-vrl-002-ref.xht +percent-padding-vrl-004.xht == reference/margin-vrl-002-ref.xht +row-progression-002.xht == reference/block-flow-direction-001-ref.xht +row-progression-003.xht == reference/block-flow-direction-001-ref.xht +row-progression-004.xht == reference/block-flow-direction-001-ref.xht +row-progression-005.xht == reference/block-flow-direction-001-ref.xht +row-progression-006.xht == reference/block-flow-direction-001-ref.xht +row-progression-007.xht == reference/block-flow-direction-001-ref.xht +row-progression-008.xht == reference/block-flow-direction-001-ref.xht +row-progression-009.xht == reference/block-flow-direction-001-ref.xht +table-column-order-002.xht == reference/block-flow-direction-001-ref.xht +table-column-order-003.xht == reference/block-flow-direction-001-ref.xht +table-column-order-004.xht == reference/block-flow-direction-001-ref.xht +table-column-order-005.xht == reference/block-flow-direction-001-ref.xht +text-align-vlr-003.xht == reference/ref-filled-green-100px-square.xht +text-align-vlr-005.xht == reference/ref-filled-green-100px-square.xht +text-align-vlr-007.xht == reference/ref-filled-green-100px-square.xht +text-align-vlr-009.xht == reference/text-align-vlr-009-ref.xht +text-align-vlr-011.xht == reference/text-align-vlr-009-ref.xht +text-align-vlr-013.xht == reference/text-align-vlr-009-ref.xht +text-align-vlr-015.xht == reference/direction-vlr-003-ref.xht +text-align-vlr-017.xht == reference/direction-vlr-003-ref.xht +text-align-vlr-019.xht == reference/direction-vlr-003-ref.xht +text-align-vrl-002.xht == reference/direction-vrl-004-ref.xht +text-align-vrl-004.xht == reference/direction-vrl-004-ref.xht +text-align-vrl-006.xht == reference/direction-vrl-004-ref.xht +text-align-vrl-008.xht == reference/text-align-vrl-008-ref.xht +text-align-vrl-010.xht == reference/text-align-vrl-008-ref.xht +text-align-vrl-012.xht == reference/text-align-vrl-008-ref.xht +text-align-vrl-014.xht == reference/direction-vrl-002-ref.xht +text-align-vrl-016.xht == reference/direction-vrl-002-ref.xht +text-align-vrl-018.xht == reference/direction-vrl-002-ref.xht +text-baseline-002.xht == reference/text-baseline-002-ref.xht +text-baseline-003.xht == reference/text-baseline-002-ref.xht +text-baseline-004.xht == reference/text-baseline-002-ref.xht +text-baseline-005.xht == reference/text-baseline-002-ref.xht +text-baseline-006.xht == reference/text-baseline-006-ref.xht +text-baseline-007.xht == reference/text-baseline-007-ref.xht +text-baseline-008.xht == reference/text-baseline-006-ref.xht +text-baseline-009.xht == reference/text-baseline-006-ref.xht +text-baseline-010.xht == reference/text-baseline-007-ref.xht +text-baseline-011.xht == reference/text-baseline-007-ref.xht +text-combine-horizontal-010.xht == reference/text-combine-horizontal-010-ref.xht +text-combine-horizontal-011.xht == reference/text-combine-horizontal-011-ref.xht +text-decoration-001.xht == reference/text-decoration-001-ref.xht +text-emphasis-001.xht == reference/text-emphasis-001-ref.xht != reference/reference/text-emphasis-001-notref.xht +text-orientation-010.xht == reference/text-orientation-010-ref.xht +text-orientation-011.xht == reference/text-orientation-011-ref.xht +text-orientation-012.xht == reference/text-orientation-012-ref.xht +text-orientation-013.xht == reference/text-orientation-013-ref.xht +text-orientation-014.xht == reference/text-orientation-014-ref.xht +text-orientation-015.xht == reference/text-orientation-015-ref.xht +text-orientation-mixed-001.xht == reference/text-orientation-mixed-001-ref.xht +text-orientation-sideways-001.xht == reference/text-orientation-sideways-right-001-ref.xht +text-orientation-sideways-002.xht == reference/text-orientation-sideways-left-001-ref.xht +text-orientation-sideways-left-001.xht == reference/text-orientation-sideways-left-001-ref.xht +text-orientation-sideways-right-001.xht == reference/text-orientation-sideways-right-001-ref.xht +text-orientation-upright-001.xht == reference/text-orientation-upright-001-ref.xht +value-all-002.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-all-003.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-all-and-inherit-001.xht == reference/value-all-and-inherit-001-ref.xht +value-digit2-and-inherit-001.xht == reference/value-digit2-and-inherit-001-ref.xht +value-digits2-002.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-digits2-003.xht == reference/vertical-ahem-1x3-ref.xht != reference/horizontal-ahem-1x3-notref.xht +value-digits3-001.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-digits3-002.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-digits3-003.xht == reference/vertical-ahem-1x4-ref.xht != reference/horizontal-ahem-1x4-notref.xht +value-digits4-001.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-digits4-002.xht == reference/vertical-ahem-1x1-ref.xht != reference/horizontal-ahem-1x1-notref.xht +value-digits4-003.xht == reference/vertical-ahem-1x5-ref.xht != reference/horizontal-ahem-1x5-notref.xht +value-none-001.xht == reference/vertical-ahem-1x3-ref.xht != reference/horizontal-ahem-1x3-notref.xht +vertical-alignment-001.xht == reference/vertical-alignment-001-ref.xht +vertical-alignment-004.xht == reference/vertical-alignment-004-ref.xht +vertical-alignment-007.xht == reference/vertical-alignment-007-ref.xht +vertical-alignment-010.xht == reference/vertical-alignment-010-ref.xht +vertical-alignment-013.xht == reference/vertical-alignment-013-ref.xht +vertical-alignment-016.xht == reference/vertical-alignment-016-ref.xht +vertical-alignment-019.xht == reference/vertical-alignment-019-ref.xht +vertical-alignment-022.xht == reference/vertical-alignment-022-ref.xht +vertical-alignment-025.xht == reference/vertical-alignment-025-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 +writing-mode-vertical-lr-002.xht == reference/writing-mode-vertical-lr-002-ref.xht +writing-mode-vertical-rl-001.xht == reference/writing-mode-vertical-rl-001-ref.xht +writing-mode-vertical-rl-002.xht == reference/writing-mode-vertical-rl-002-ref.xht +writing-mode-vertical-rl-003.xht == reference/writing-mode-vertical-rl-003-ref.xht diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-002.xht new file mode 100644 index 00000000000..97167c88de8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-002.xht @@ -0,0 +1,30 @@ +<!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: alternate text of image and vertical 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" /> + + <meta content="should" name="flags" /> + <meta content="This test checks that alternate text (latin) of image rotates 90° clockwise in vertical writing mode." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + font-size: 2em; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if the words "Text sample" are <strong>rotated 90° clockwise</strong>.</p> + + <div><img src="#" alt="Text sample" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-003.xht new file mode 100644 index 00000000000..728bb346e74 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/replaced-content-image-003.xht @@ -0,0 +1,30 @@ +<!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: alternate text of image and vertical 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" /> + + <meta content="should" name="flags" /> + <meta content="This test checks that alternate text (latin) of image rotates 90° clockwise in vertical writing mode." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + font-size: 2em; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if the words "Text sample" are <strong>rotated 90° clockwise</strong>.</p> + + <div><img src="#" alt="Text sample" /></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-002.xht new file mode 100644 index 00000000000..a07f3c557ef --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-002.xht @@ -0,0 +1,62 @@ +<!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-rl - table rows progression</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The right-most "S" --> + <tr><td>A B C DDD</td><td>EE F G H</td><td>JJ K L M</td></tr> + +<!-- The left-most "S" --> + <tr><td>N O Q RRR</td><td>SS T U V</td><td>WW X Y Z</td></tr> + +<!-- The "A" --> + <tr><td>aaa b c ddd</td><td>ee f g hh</td><td>jj kk</td></tr> + +<!-- The "P" --> + <tr><td class="left-most-cell">mmm n o qqq</td><td class="left-most-cell">r s t uu</td><td class="left-most-cell"> vv</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-003.xht new file mode 100644 index 00000000000..c2a14c79b62 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-003.xht @@ -0,0 +1,62 @@ +<!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-lr - table rows progression</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The "P" --> + <tr><td class="left-most-cell">AAA B C DDD</td><td class="left-most-cell">EE F G H</td><td class="left-most-cell">JJ </td></tr> + +<!-- The "A" --> + <tr><td>KKK L M NNN</td><td>OO Q R SS</td><td>TT UU</td></tr> + +<!-- The left-most "S" --> + <tr><td>VVV W X Y </td><td>a b c dd</td><td> e f g hh</td></tr> + +<!-- The right-most "S" --> + <tr><td>jjj k m n </td><td>q r s tt</td><td> u v w xx</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-004.xht new file mode 100644 index 00000000000..9d51c947cb7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-004.xht @@ -0,0 +1,62 @@ +<!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-rl - table rows progression and colspan</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The right-most "S" --> + <tr><td>A B C DDD</td><td>EE F G H</td><td>JJ K L M</td></tr> + +<!-- The left-most "S" --> + <tr><td colspan="2">N OO Q R S T UUUU</td><td>WW X Y Z</td></tr> + +<!-- The "A" --> + <tr><td>aaa b c ddd</td><td colspan="2">eeff g h jjjj</td></tr> + +<!-- The "P" --> + <tr><td class="left-most-cell">mmm n o qqq</td><td class="left-most-cell">r s t uu</td><td class="left-most-cell"> vv</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-005.xht new file mode 100644 index 00000000000..9f4ce7e26fc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-005.xht @@ -0,0 +1,62 @@ +<!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-lr - table rows progression and colspan</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The "P" --> + <tr><td class="left-most-cell">AAA B C DDD</td><td class="left-most-cell">EE F G H</td><td class="left-most-cell">JJ </td></tr> + +<!-- The "A" --> + <tr><td colspan="2">KKKOO L Q M R NNNSS</td><td>TT UU</td></tr> + +<!-- The left-most "S" --> + <tr><td>VVV W X Y </td><td colspan="2">a b c d e f gggg</td></tr> + +<!-- The right-most "S" --> + <tr><td>jjj k m n </td><td>q r s tt</td><td> u v w xx</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-006.xht new file mode 100644 index 00000000000..b6999cb6460 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-006.xht @@ -0,0 +1,62 @@ +<!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-rl - table rows progression and rowspan</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rowspanned cells in a table are handled according to a right-to-left direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The right-most "S" --> + <tr><td>A B C DDD</td><td>EE F G H</td><td rowspan="2">JJ K L M WW X Y Z</td></tr> + +<!-- The left-most "S" --> + <tr><td>N O Q RRR</td><td>SS T U V</td></tr> + +<!-- The "A" --> + <tr><td>aaa b c ddd</td><td rowspan="2" class="left-most-cell">ee f g hh r s t uu</td><td>jj kk</td></tr> + +<!-- The "P" --> + <tr><td class="left-most-cell">mmm n o qqq</td><td class="left-most-cell"> vv</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-007.xht new file mode 100644 index 00000000000..72b1ccf0790 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-007.xht @@ -0,0 +1,62 @@ +<!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-lr - table rows progression and rowspan</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rowspanned cells in a table are handled according to a left-to-right direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + +<!-- The "P" --> + <tr><td class="left-most-cell">AAA B C DDD</td><td class="left-most-cell">EE F G H</td><td class="left-most-cell" rowspan="2">JJ TT UU</td></tr> + +<!-- The "A" --> + <tr><td>KKK L M NNN</td><td>OO Q R SS</td></tr> + +<!-- The left-most "S" --> + <tr><td>VVV W X Y </td><td rowspan="2">a b c dd q r s tt</td><td> e f g hh</td></tr> + +<!-- The right-most "S" --> + <tr><td>jjj k m n </td><td> u v w xx</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-008.xht new file mode 100644 index 00000000000..25d00f8b1ce --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-008.xht @@ -0,0 +1,77 @@ +<!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-rl - table rows progression (thead, 2 tbodies, tfoot)</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + + <thead> + +<!-- The right-most "S" --> + <tr><td>A B C DDD</td><td>EE F G H</td><td>JJ K L M</td></tr> + + </thead> + + <tfoot> + +<!-- The "P" --> + <tr><td class="left-most-cell">mmm n o qqq</td><td class="left-most-cell">r s t uu</td><td class="left-most-cell"> vv</td></tr> + + </tfoot> + + <tbody> + +<!-- The left-most "S" --> + <tr><td>N O Q RRR</td><td>SS T U V</td><td>WW X Y Z</td></tr> + + </tbody> + + <tbody> +<!-- The "A" --> + <tr><td>aaa b c ddd</td><td>ee f g hh</td><td>jj kk</td></tr> + + </tbody> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-009.xht new file mode 100644 index 00000000000..e9f3f6761db --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/row-progression-009.xht @@ -0,0 +1,78 @@ +<!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-lr - table rows progression (thead, 2 tbodies, tfoot)</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="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc..." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + + <thead> + +<!-- The "P" --> + <tr><td class="left-most-cell">AAA B C DDD</td><td class="left-most-cell">EE F G H</td><td class="left-most-cell">JJ </td></tr> + + </thead> + + <tfoot> + +<!-- The right-most "S" --> + <tr><td>jjj k m n </td><td>q r s tt</td><td> u v w xx</td></tr> + + </tfoot> + + <tbody> + +<!-- The "A" --> + <tr><td>KKK L M NNN</td><td>OO Q R SS</td><td>TT UU</td></tr> + + </tbody> + + <tbody> + +<!-- The left-most "S" --> + <tr><td>VVV W X Y </td><td>a b c dd</td><td> e f g hh</td></tr> + + </tbody> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-lime.png Binary files differnew file mode 100644 index 00000000000..1b947700808 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-red.png Binary files differnew file mode 100644 index 00000000000..57bf3ddc521 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/100x100-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-green.png Binary files differnew file mode 100644 index 00000000000..b98ca0ba0a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-lime.png Binary files differnew file mode 100644 index 00000000000..cb397fb090e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-maroon.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-maroon.png Binary files differnew file mode 100644 index 00000000000..3f86b072195 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-maroon.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-navy.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-navy.png Binary files differnew file mode 100644 index 00000000000..9b9a03955ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-navy.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-red.png Binary files differnew file mode 100644 index 00000000000..6bd73ac1018 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-white.png Binary files differnew file mode 100644 index 00000000000..dd43faec54a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/1x1-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-gg-rr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-gg-rr.png Binary files differnew file mode 100644 index 00000000000..84f5b2a4f1d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-gg-rr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-green.png Binary files differnew file mode 100644 index 00000000000..b3c8cf3eb4c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-red.png Binary files differnew file mode 100644 index 00000000000..823f125b8e4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/60x60-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/DejaVuSerif-webfont.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/DejaVuSerif-webfont.woff Binary files differnew file mode 100644 index 00000000000..4583cc675d7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/DejaVuSerif-webfont.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/README b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/README new file mode 100644 index 00000000000..69d1737bead --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/README @@ -0,0 +1,29 @@ +CSS Global Support Directory +============================ + +This directory contains common support files (such as images and external +style sheets). These are sync'ed into the support directories of all our +test suites. If you have test-suite-specific support files, please add +them to the appropriate test-suite-specific support/ directory. + +If you add to a support/ directory, please run the tools/supportprop.py +script from the top of the repository to cascade support files into the +lower-level support directories. + +Description of the Common Support File Collection +------------------------------------------------- + +The 1x1-* images are all exactly one pixel. + +The swatch-* images all use 15x15 cells. + +The square-* images all use 15x15 cells with one pixel borders. + +The pattern-* images use cells of various sizes: + + pattern-gg-gr.png 20x20 + pattern-grg-rgr-grg.png 20x20 + pattern-rgr-grg-rgr.png 20x20 + pattern-tr.png 15x15 + pattern-grg-rrg-rgg.png 15x15 + diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/a-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/a-green.css new file mode 100644 index 00000000000..b0dbb071d5b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/a-green.css @@ -0,0 +1 @@ +.a { color: green; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/b-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/b-green.css new file mode 100644 index 00000000000..a0473f5ca26 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/b-green.css @@ -0,0 +1 @@ +.b { color: green; }
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-2row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-2row-320x320.png Binary files differnew file mode 100644 index 00000000000..4f354e93527 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-2row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-3row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-3row-320x320.png Binary files differnew file mode 100644 index 00000000000..6eded69a4a3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-2col-3row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-2row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-2row-320x320.png Binary files differnew file mode 100644 index 00000000000..5f4b53c46b7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-2row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-3row-320x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-3row-320x320.png Binary files differnew file mode 100644 index 00000000000..4c2f6c8e632 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/bg-red-3col-3row-320x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/block-flow-direction-025-exp-res.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/block-flow-direction-025-exp-res.png Binary files differnew file mode 100644 index 00000000000..851eeea0398 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/block-flow-direction-025-exp-res.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-220x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-220x1.png Binary files differnew file mode 100644 index 00000000000..3898d5a2d9e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-220x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-320x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-320x1.png Binary files differnew file mode 100644 index 00000000000..7d9151c848a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-horiz-line-320x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x220.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x220.png Binary files differnew file mode 100644 index 00000000000..07b0239fc52 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x220.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x320.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x320.png Binary files differnew file mode 100644 index 00000000000..6049e271506 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-vert-line-1x320.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-yellow-206w-165h.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-yellow-206w-165h.png Binary files differnew file mode 100644 index 00000000000..47ceb84d3fb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue-yellow-206w-165h.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue1x1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue1x1.png Binary files differnew file mode 100644 index 00000000000..667b6558892 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue1x1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue20x20.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue20x20.png Binary files differnew file mode 100644 index 00000000000..e0af5553303 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/blue20x20.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/c-red.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/c-red.css new file mode 100644 index 00000000000..d4ba5c64e95 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/c-red.css @@ -0,0 +1 @@ +.c { color: red; }
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/cat.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/cat.png Binary files differnew file mode 100644 index 00000000000..85dd7324815 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/cat.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-002.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-002.png Binary files differnew file mode 100644 index 00000000000..7fc9f14ed6e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-002.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-004.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-004.png Binary files differnew file mode 100644 index 00000000000..2d1355e3bdb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-004.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-006.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-006.png Binary files differnew file mode 100644 index 00000000000..5145c22c485 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/clearance-calculation-vrl-006.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-green.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-green.css new file mode 100644 index 00000000000..537104e6633 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-green.css @@ -0,0 +1 @@ +.import { color: green; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-red.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-red.css new file mode 100644 index 00000000000..9945ef47114 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/import-red.css @@ -0,0 +1 @@ +.import { color: red; } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-bottom-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-bottom-200x300.png Binary files differnew file mode 100644 index 00000000000..6e30eba507a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-bottom-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-center-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-center-200x300.png Binary files differnew file mode 100644 index 00000000000..6025c4e85be --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-center-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-side-filled-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-side-filled-square-40x160.png Binary files differnew file mode 100644 index 00000000000..86fd7e5671d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-side-filled-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-top-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-top-200x300.png Binary files differnew file mode 100644 index 00000000000..43e739acbc2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/left-top-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/margin-collapse-2em-space-wm-vert.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/margin-collapse-2em-space-wm-vert.png Binary files differnew file mode 100644 index 00000000000..8a2fa55efdf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/margin-collapse-2em-space-wm-vert.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/mplus-1p-regular.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/mplus-1p-regular.woff Binary files differnew file mode 100644 index 00000000000..42cfff628b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/mplus-1p-regular.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/opaque-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/opaque-square-40x160.png Binary files differnew file mode 100644 index 00000000000..11636f5f771 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/opaque-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p1.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p1.png Binary files differnew file mode 100644 index 00000000000..f5adb11b4b4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p1.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p2.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p2.png Binary files differnew file mode 100644 index 00000000000..7ecf84bae34 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p2.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p3.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p3.png Binary files differnew file mode 100644 index 00000000000..d7c58d62243 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p3.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p4.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p4.png Binary files differnew file mode 100644 index 00000000000..04dc0fe2e9e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/page-flow-direction-002p4.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-abs-pos-non-replaced.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-abs-pos-non-replaced.png Binary files differnew file mode 100644 index 00000000000..15fd6065ef6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-abs-pos-non-replaced.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-002.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-002.png Binary files differnew file mode 100644 index 00000000000..a0db6909418 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-002.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-004.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-004.png Binary files differnew file mode 100644 index 00000000000..ec130f10f46 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-004.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-006.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-006.png Binary files differnew file mode 100644 index 00000000000..981741b7e53 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-006.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-008.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-008.png Binary files differnew file mode 100644 index 00000000000..9b2a0610e4e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-008.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-010.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-010.png Binary files differnew file mode 100644 index 00000000000..a2d66146186 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-010.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-012.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-012.png Binary files differnew file mode 100644 index 00000000000..23b1beb9cd4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-012.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-014.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-014.png Binary files differnew file mode 100644 index 00000000000..64e081c72f1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-014.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-016.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-016.png Binary files differnew file mode 100644 index 00000000000..952e0089b8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-bg-pos-vrl-016.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-box-offsets-rel-pos.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-box-offsets-rel-pos.png Binary files differnew file mode 100644 index 00000000000..e81c0ae4cf5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-box-offsets-rel-pos.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-clearance-calculations.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-clearance-calculations.png Binary files differnew file mode 100644 index 00000000000..ec502d3532a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-clearance-calculations.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-float-contiguous.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-float-contiguous.png Binary files differnew file mode 100644 index 00000000000..8d35d98e9c4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-float-contiguous.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-horiz-rule.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-horiz-rule.png Binary files differnew file mode 100644 index 00000000000..f9cc0b1eeff --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pass-cdts-horiz-rule.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..b14c75ea2c0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr.png Binary files differnew file mode 100644 index 00000000000..091de70bb72 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-gr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..80c7035f1fc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rr-100x100.png Binary files differnew file mode 100644 index 00000000000..a98636ddef3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gg-rr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gg-100x100.png Binary files differnew file mode 100644 index 00000000000..fd1f7a7b50a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..431b99f933a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..63248d4dd1f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-gr-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rgr-grg.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rgr-grg.png Binary files differnew file mode 100644 index 00000000000..9b88fbd8114 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rgr-grg.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rrg-rgg.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rrg-rgg.png Binary files differnew file mode 100644 index 00000000000..fcf4f3fd7d9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-grg-rrg-rgg.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gg-100x100.png Binary files differnew file mode 100644 index 00000000000..47ee743880e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gr-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gr-100x100.png Binary files differnew file mode 100644 index 00000000000..6b19ec9a4e7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-gr-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-rg-100x100.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-rg-100x100.png Binary files differnew file mode 100644 index 00000000000..e28bdba9dd6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rg-rg-100x100.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rgr-grg-rgr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rgr-grg-rgr.png Binary files differnew file mode 100644 index 00000000000..d454e3a630c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-rgr-grg-rgr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-tr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-tr.png Binary files differnew file mode 100644 index 00000000000..8b4b25364e0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/pattern-tr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-bottom-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-bottom-200x300.png Binary files differnew file mode 100644 index 00000000000..38904b25087 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-bottom-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-center-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-center-200x300.png Binary files differnew file mode 100644 index 00000000000..b9987017a06 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-center-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-side-filled-square-40x160.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-side-filled-square-40x160.png Binary files differnew file mode 100644 index 00000000000..f76b2083118 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-side-filled-square-40x160.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-top-200x300.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-top-200x300.png Binary files differnew file mode 100644 index 00000000000..59467ec3f18 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/right-top-200x300.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50%.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50%.png Binary files differnew file mode 100644 index 00000000000..cf2eea6b438 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50%.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50px.png Binary files differnew file mode 100644 index 00000000000..9f46583665c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-h-50px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-100px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-100px.png Binary files differnew file mode 100644 index 00000000000..a837eca2225 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-100px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-50px.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-50px.png Binary files differnew file mode 100644 index 00000000000..84141028020 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/ruler-v-50px.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/sileot-webfont.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/sileot-webfont.woff Binary files differnew file mode 100644 index 00000000000..81547578d36 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/sileot-webfont.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/solidblue.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/solidblue.png Binary files differnew file mode 100644 index 00000000000..8584a701a80 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/solidblue.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-purple.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-purple.png Binary files differnew file mode 100644 index 00000000000..0f522d78728 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-purple.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-teal.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-teal.png Binary files differnew file mode 100644 index 00000000000..e567f51b91b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-teal.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-white.png Binary files differnew file mode 100644 index 00000000000..5853cbb238c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/square-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-blue.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-blue.png Binary files differnew file mode 100644 index 00000000000..bf2759634d4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-blue.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-fuchsia.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-fuchsia.png Binary files differnew file mode 100644 index 00000000000..3f8f8b4ea37 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-fuchsia.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-green.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-green.png Binary files differnew file mode 100644 index 00000000000..0aa79b0c86b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-green.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-lime.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-lime.png Binary files differnew file mode 100644 index 00000000000..55fd7fdaedf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-lime.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-orange.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-orange.png Binary files differnew file mode 100644 index 00000000000..d3cd498b52b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-orange.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-red.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-red.png Binary files differnew file mode 100644 index 00000000000..1caf25c992a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-red.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-teal.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-teal.png Binary files differnew file mode 100644 index 00000000000..0293ce89dea --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-teal.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-white.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-white.png Binary files differnew file mode 100644 index 00000000000..1a7d4323d77 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-white.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-yellow.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-yellow.png Binary files differnew file mode 100644 index 00000000000..1591aa0e2e2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/swatch-yellow.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/tcu-font.woff b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/tcu-font.woff Binary files differnew file mode 100644 index 00000000000..c880aaab5cf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/tcu-font.woff diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-bl.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-bl.png Binary files differnew file mode 100644 index 00000000000..904e24e996a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-bl.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-br.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-br.png Binary files differnew file mode 100644 index 00000000000..f413ff5c1a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-br.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-inner-half-size.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-inner-half-size.png Binary files differnew file mode 100644 index 00000000000..e473bf80efc --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-inner-half-size.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-outer.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-outer.png Binary files differnew file mode 100644 index 00000000000..82eeace7fc0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-outer.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-style.css b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-style.css new file mode 100644 index 00000000000..f2ffea039b1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-style.css @@ -0,0 +1,18 @@ + #test01, #test02, #test03{ + width: 50px; + height: 50px; + text-align:center; + font-size: 20px; + } + #test{ + background: #ff0000; + } + #test01{ + background: #7FFF00; + } + #test02{ + background: #00FFFF; + } + #test03{ + background: #4169E1; + } diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tl.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tl.png Binary files differnew file mode 100644 index 00000000000..f6ac0ef7e8f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tl.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tr.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tr.png Binary files differnew file mode 100644 index 00000000000..59843ae54b6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/test-tr.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-mixed-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-mixed-001.png Binary files differnew file mode 100644 index 00000000000..2bd5927f901 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-mixed-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-left-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-left-001.png Binary files differnew file mode 100644 index 00000000000..51921a7e91a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-left-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-right-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-right-001.png Binary files differnew file mode 100644 index 00000000000..f4bfd48549f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-sideways-right-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-upright-001.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-upright-001.png Binary files differnew file mode 100644 index 00000000000..d7df4098ed2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/text-orientation-upright-001.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-form.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-form.png Binary files differnew file mode 100644 index 00000000000..53a3af92cd6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-form.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-horizontal-list-markers.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-horizontal-list-markers.png Binary files differnew file mode 100644 index 00000000000..ae8430fb46d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/vertical-horizontal-list-markers.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-59x59.png Binary files differnew file mode 100644 index 00000000000..50816d38f6b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-horiz-redline-bottom-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-horiz-redline-bottom-59x59.png Binary files differnew file mode 100644 index 00000000000..d6139238de3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-horiz-redline-bottom-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-center-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-center-59x59.png Binary files differnew file mode 100644 index 00000000000..c352b109548 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-center-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-left-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-left-59x59.png Binary files differnew file mode 100644 index 00000000000..8baf6f60404 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-left-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-right-59x59.png b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-right-59x59.png Binary files differnew file mode 100644 index 00000000000..7e881312b35 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/support/yellow-square-vert-redline-right-59x59.png diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-002.xht new file mode 100644 index 00000000000..7a9de3da6ee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-002.xht @@ -0,0 +1,63 @@ +<!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: 'direction: rtl' - table columns order and vertical-rl</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-01-25 --> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#direction" title="2.1 Specifying Directionality: the direction property" /> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table with 'writing-mode' set to 'vertical-rl' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + direction: rtl; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + <table> + + <!-- The right-most "S" --> + <tr><td><!-- bottommost column -->AA B C D</td><td>EE F G H </td><td><!-- topmost column -->J K L MMM</td></tr> + + <!-- The left-most "S" --> + <tr><td><!-- bottommost column -->NN O Q R</td><td>SS T U V </td><td><!-- topmost column -->W X Y ZZZ</td></tr> + + <!-- The "A" --> + <tr><td><!-- bottommost column -->aa bb</td><td>ee f g hh</td><td><!-- topmost column -->jjj k l mmm</td></tr> + + <!-- The "P" --> + <tr><td class="left-most-cell"><!-- bottommost column --> nn</td><td class="left-most-cell">r s t uu</td><td class="left-most-cell"><!-- topmost column -->vvv w x yyy</td></tr> + + </table> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-003.xht new file mode 100644 index 00000000000..00466702019 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-003.xht @@ -0,0 +1,62 @@ +<!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: 'direction: rtl' - table columns order and vertical-lr</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-01-25 --> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#direction" title="2.1 Specifying Directionality: the direction property" /> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that a table with 'writing-mode' set to 'vertical-lr' and with 'direction' set to 'rtl' will have its column displayed from bottom (1st column) to top (last column). The inline base direction is still from top to bottom." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + direction: rtl; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + <table> + <!-- The "P" --> + <tr><td class="left-most-cell"><!-- bottommost column -->AA </td><td class="left-most-cell">BB C D E </td><td class="left-most-cell"><!-- topmost column -->FFF G H III</td></tr> + + <!-- The "A" --> + <tr><td><!-- bottommost column -->JJ KK</td><td>LL M N OO</td><td><!-- topmost column -->PPP Q R SSS</td></tr> + + <!-- The left-most "S" --> + <tr><td><!-- bottommost column --> T U V WW</td><td>X Y Z aa</td><td><!-- topmost column -->bbb c d e </td></tr> + + <!-- The right-most "S" --> + <tr><td><!-- bottommost column --> f g h ii</td><td>j k l mm</td><td><!-- topmost column -->nnn o q r </td></tr> + + </table> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-004.xht new file mode 100644 index 00000000000..a1fec75293c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-004.xht @@ -0,0 +1,65 @@ +<!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: 'direction: rtl' - table columns order and vertical-rl</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-01-25 --> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#direction" title="2.1 Specifying Directionality: the direction property" /> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + direction: rtl; + writing-mode: vertical-rl; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + + <!-- The right-most "S" --> + <tr><td><!-- bottommost column -->AA B C D</td><td>EE F G H </td><td><!-- topmost column -->I J K LLL</td></tr> + + <!-- The left-most "S" --> + <tr><td colspan="2"><!-- bottommost column -->MMMM N N O O P P</td><td><!-- topmost column -->Q R S TTT</td></tr> + + <!-- The "A" --> + <tr><td><!-- bottommost column -->UU VV</td><td colspan="2"><!-- topmost column -->WWWWW X X Y Y ZZZZZ</td></tr> + + <!-- The "P" --> + <tr><td class="left-most-cell"><!-- bottommost column --> aa</td><td class="left-most-cell"> b c d ee</td><td class="left-most-cell"><!-- topmost column -->fff g h iii</td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-005.xht new file mode 100644 index 00000000000..b2d7c7af38a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/table-column-order-005.xht @@ -0,0 +1,65 @@ +<!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: 'direction: rtl' - table columns order and vertical-lr</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-01-25 --> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#direction" title="2.1 Specifying Directionality: the direction property" /> + <link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/block-flow-direction-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + <meta content="This test checks that colspanned cells in a table with 'direction' set to 'rtl' are handled according to a bottom-to-top column direction." name="assert" /> + + <style type="text/css"><![CDATA[ + body + { + color: yellow; + font: 1.25em/1 Ahem; + } + + table + { + background-color: blue; + border-spacing: 0em; + border: blue solid 1em; + height: 7em; + direction: rtl; + writing-mode: vertical-lr; + } + + td + { + padding-bottom: 0em; + padding-left: 1em; + padding-right: 0em; + padding-top: 0em; + } + + td.left-most-cell { padding-left: 0em; } + ]]></style> + </head> + + <body> + + <table> + + <!-- The "P" --> + <tr><td class="left-most-cell"><!-- bottommost column -->AA </td><td class="left-most-cell">BB C D E </td><td class="left-most-cell"><!-- topmost column -->FFF G H III</td></tr> + + <!-- The "A" --> + <tr><td colspan="2"><!-- bottommost column -->JJJJ K L MMMM</td><td><!-- topmost column -->NNN O P QQQ</td></tr> + + <!-- The left-most "S" --> + <tr><td><!-- bottommost column --> R S T UU</td><td colspan="2"><!-- topmost column -->VVVV W X Y Z a bb</td></tr> + + <!-- The right-most "S" --> + <tr><td><!-- bottommost column --> c d b cc</td><td>d e f gg</td><td><!-- topmost column -->hhh i j k </td></tr> + + </table> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-003.xht new file mode 100644 index 00000000000..621cab36d19 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-003.xht @@ -0,0 +1,40 @@ +<!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: 'text-align: left' - 'vertical-lr' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-top-200x300.png"); + direction: ltr; + text-align: left; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-005.xht new file mode 100644 index 00000000000..1d18d5eb64e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-005.xht @@ -0,0 +1,41 @@ +<!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: 'text-align: left' - 'vertical-lr' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: left' aligns an inline box within a line box with respect to the line box's logical left side (line-left side). Here, 'direction: rtl' has no impact, no influence on such alignment." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-top-200x300.png"); + direction: rtl; + text-align: left; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-007.xht new file mode 100644 index 00000000000..aada7642827 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-007.xht @@ -0,0 +1,39 @@ +<!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: 'text-align: left' - 'vertical-lr' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/ref-filled-green-100px-square.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-top-200x300.png"); + text-align: left; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-009.xht new file mode 100644 index 00000000000..24059bd0dd9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-009.xht @@ -0,0 +1,50 @@ +<!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: 'text-align: center' - 'vertical-lr' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vlr-009-ref.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-center-200x300.png"); + direction: ltr; + text-align: center; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-011.xht new file mode 100644 index 00000000000..95622b8d24e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-011.xht @@ -0,0 +1,52 @@ +<!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: 'text-align: center' - 'vertical-lr' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vlr-009-ref.xht" /> + + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-center-200x300.png"); + direction: rtl; + text-align: center; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-013.xht new file mode 100644 index 00000000000..d65e49e2c35 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-013.xht @@ -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"> + + <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + + <title>CSS Writing Modes Test: 'text-align: center' - 'vertical-lr' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vlr-009-ref.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-center-200x300.png"); + text-align: center; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-015.xht new file mode 100644 index 00000000000..c6da3790c2d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-015.xht @@ -0,0 +1,50 @@ +<!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: 'text-align: right' - 'vertical-lr' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vlr-003-ref.xht" /> + + <meta content="ahem image" name="flags" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-bottom-200x300.png"); + direction: ltr; + text-align: right; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-017.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-017.xht new file mode 100644 index 00000000000..8374d98d00e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-017.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: right' - 'vertical-lr' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vlr-003-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: right' aligns an inline box within a line box with respect to the line box's logical right side (line-right side). Here, 'direction: rtl' has no impact, no influence on such alignment." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-bottom-200x300.png"); + direction: rtl; + text-align: right; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-019.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-019.xht new file mode 100644 index 00000000000..72f0a65ca18 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vlr-019.xht @@ -0,0 +1,50 @@ +<!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: 'text-align: right' - 'vertical-lr' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vlr-003-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/left-bottom-200x300.png"); + text-align: right; + writing-mode: vertical-lr; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-002.xht new file mode 100644 index 00000000000..35951b90fae --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-002.xht @@ -0,0 +1,41 @@ +<!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: 'text-align: left' - 'vertical-rl' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: left' aligns an inline box within a line box with respect to such line box's logical left side (line-left side)." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-top-200x300.png"); + direction: ltr; + text-align: left; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-004.xht new file mode 100644 index 00000000000..7e0d9614236 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-004.xht @@ -0,0 +1,41 @@ +<!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: 'text-align: left' - 'vertical-rl' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: left' aligns an inline box within a line box with respect to the line box's logical left side (line-left side). Here, 'direction: rtl' has no impact, no influence on such alignment." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-top-200x300.png"); + direction: rtl; + text-align: left; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-006.xht new file mode 100644 index 00000000000..eb56acec5db --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-006.xht @@ -0,0 +1,40 @@ +<!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: 'text-align: left' - 'vertical-rl' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-004-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: left' aligns an inline box within a line box with respect to such line box's logical left side (line-left side)." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-top-200x300.png"); + text-align: left; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>T</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-008.xht new file mode 100644 index 00000000000..cb074eb9148 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-008.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: center' - 'vertical-rl' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vrl-008-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: center' centers an inline box within a line box with respect to such line box's logical left and right sides (line-left and line-right sides)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-center-200x300.png"); + direction: ltr; + text-align: center; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-010.xht new file mode 100644 index 00000000000..851a991be21 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-010.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: center' - 'vertical-rl' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vrl-008-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-center-200x300.png"); + direction: rtl; + text-align: center; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-012.xht new file mode 100644 index 00000000000..92fe7d9b97f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-012.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: center' - 'vertical-rl' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/text-align-vrl-008-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: center' centers an inline box within a line box with respect to the line box's logical left and right sides (line-left and line-right sides)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-center-200x300.png"); + text-align: center; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>C</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-014.xht new file mode 100644 index 00000000000..c769a0f1420 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-014.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: right' - 'vertical-rl' and 'direction: ltr'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-bottom-200x300.png"); + direction: ltr; + text-align: right; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-016.xht new file mode 100644 index 00000000000..841d86addac --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-016.xht @@ -0,0 +1,51 @@ +<!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: 'text-align: right' - 'vertical-rl' and 'direction: rtl'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: right' aligns an inline box within a line box with respect to the line box's logical right side (line-right side). Here, 'direction: rtl' has no impact, no influence on such alignment." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-bottom-200x300.png"); + direction: rtl; + text-align: right; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-018.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-018.xht new file mode 100644 index 00000000000..fb33b57d928 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-align-vrl-018.xht @@ -0,0 +1,50 @@ +<!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: 'text-align: right' - 'vertical-rl' and initial, default 'direction'</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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" /> + <link rel="match" href="reference/direction-vrl-002-ref.xht" /> + + <meta content="ahem image" name="flags" /> + <meta content="This test checks that 'text-align: right' aligns an inline box within a line box with respect to such line box's logical right side (line-right side)." name="assert" /> + + <style type="text/css"><![CDATA[ + p + { + line-height: 1.25; + } + + strong + { + line-height: 1; + } + + div + { + color: green; + font: 6.25em/1 Ahem; /* computes to 100px/100px */ + height: 300px; + width: 200px; + } + + div + { + background: red url("support/right-bottom-200x300.png"); + text-align: right; + writing-mode: vertical-rl; + } + ]]></style> + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div>B</div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-002.xht new file mode 100644 index 00000000000..8b5c8ce0fe7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-002.xht @@ -0,0 +1,42 @@ +<!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: text baseline alignment - central alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-002-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#rl-mixed + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-rl; + text-orientation: mixed; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="rl-mixed">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-003.xht new file mode 100644 index 00000000000..58e4310964d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-003.xht @@ -0,0 +1,42 @@ +<!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: text baseline alignment - central alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-002-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'mixed', then the central baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#lr-mixed + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-lr; + text-orientation: mixed; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="lr-mixed">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-004.xht new file mode 100644 index 00000000000..b520b8f37f0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-004.xht @@ -0,0 +1,42 @@ +<!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: text baseline alignment - central alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-002-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#rl-upright + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-rl; + text-orientation: upright; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="rl-upright">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-005.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-005.xht new file mode 100644 index 00000000000..937c226eb21 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-005.xht @@ -0,0 +1,42 @@ +<!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: text baseline alignment - central alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-002-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'upright', then the central baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#lr-upright + { + color: orange; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-lr; + text-orientation: upright; + } + + span#blue120 + { + color: blue; + font-size: 2em; /* computes to 120px */ + } + + span#orange30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if 2 orange squares are centered with respect to a blue square.</p> + + <div id="lr-upright">A<span id="blue120">B</span><span id="orange30">O</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-006.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-006.xht new file mode 100644 index 00000000000..a5542e030e7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-006.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-006-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#rl-sideways + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-rl; + text-orientation: sideways; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>left edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="rl-sideways">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-007.xht new file mode 100644 index 00000000000..00c25eca29e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-007.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-007-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#lr-sideways + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-lr; + text-orientation: sideways; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="lr-sideways">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-008.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-008.xht new file mode 100644 index 00000000000..8a71a1ea47b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-008.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-006-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#rl-sideways-right + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-rl; + text-orientation: sideways-right; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>left edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="rl-sideways-right">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-009.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-009.xht new file mode 100644 index 00000000000..f7597f50a13 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-009.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-006-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways-right', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#lr-sideways-right + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-lr; + text-orientation: sideways-right; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>left edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="lr-sideways-right">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-010.xht new file mode 100644 index 00000000000..b1fdd33ba42 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-010.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-007-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-rl' and when 'text-orientation' is 'sideways-left', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#rl-sideways-left + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-rl; + text-orientation: sideways-left; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="rl-sideways-left">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-011.xht new file mode 100644 index 00000000000..2ed68c37562 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-baseline-011.xht @@ -0,0 +1,41 @@ +<!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: text baseline alignment - alphabetical alignment with vertical layout</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-02-20 --> + <link rel="help" title="4.2. Text Baseline" href="http://www.w3.org/TR/css-writing-modes-3/#text-baselines" /> + <link rel="match" href="reference/text-baseline-007-ref.xht" /> + <meta name="assert" content="This test checks the generation of text baseline. When 'writing-mode' is 'vertical-lr' and when 'text-orientation' is 'sideways-left', then the alphabetical baseline is used as the dominant baseline." /> + <meta name="flags" content="ahem" /> + <style type="text/css"><![CDATA[ + div#lr-sideways-left + { + color: fuchsia; + font: 3.75em/1.5 Ahem; /* computes to 60px/90px */ + height: 4em; + writing-mode: vertical-lr; + text-orientation: sideways-left; + } + + span#fuchsia120 + { + font-size: 2em; /* computes to 120px */ + } + + span#fuchsia30 + { + font-size: 0.5em; /* computes to 30px */ + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the <strong>right edge</strong> of an irregular polygon is straight and unbroken.</p> + + <div id="lr-sideways-left">É<span id="fuchsia120">É</span><span id="fuchsia30">É</span></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-010.xht new file mode 100644 index 00000000000..5238253b103 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-010.xht @@ -0,0 +1,51 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-combine-horizontal - none</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="9.1. Horizontal-in-Vertical Composition: the ‘text-combine-horizontal’ property" href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-horizontal"/> + <link rel="match" href="reference/text-combine-horizontal-010-ref.xht"/> + <meta http-equiv="content-language" content="en, ja"/> + <meta name="flags" content="font"/> + <meta name="assert" content="This test verifies that 'text-combine-horizontal: none' does not combine multiple characters into the space of a single character i.e. characters from horizontal-only scripts are set sideways, i.e. 90° clockwise from their standard orientation in horizontal text."/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + div + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 2; + width: 4em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #test + { + } + .tcy /* tate-cyu-yoko: horizontal-in-vertical */ + { + text-combine-horizontal: none; // The property to be tested + } + #control + { + text-orientation: mixed; + -webkit-text-orientation: mixed; + } + </style> + </head> + <body lang="en"> + <p>Test passes if the upper block is <strong>identical</strong> to the lower block, including orientation of each character.</p> + <div id="test" lang="ja"><span class="tcy">1</span>月<span class="tcy">2</span>日の次の日は、<br/><span class="tcy">1</span>月<span class="tcy">3</span>日です。</div> + <hr/> + <div id="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-011.xht new file mode 100644 index 00000000000..f3968a5306c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-horizontal-011.xht @@ -0,0 +1,51 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-combine-horizontal - all</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="9.1. Horizontal-in-Vertical Composition: the ‘text-combine-horizontal’ property" href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-horizontal"/> + <link rel="match" href="reference/text-combine-horizontal-011-ref.xht"/> + <meta http-equiv="content-language" content="en, ja"/> + <meta name="flags" content="font"/> + <meta name="assert" content="This test verifies that 'text-combine-horizontal: all' display the text contents of the element horizontally within the vertical line box. i.e. characters from horizontal-only scripts are rendered upright."/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + div + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 2; + width: 4em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #test + { + } + .tcy /* tate-cyu-yoko: horizontal-in-vertical */ + { + text-combine-horizontal: all; // The property to be tested + } + #control + { + text-orientation: upright; + -webkit-text-orientation: upright; + } + </style> + </head> + <body lang="en"> + <p>Test passes if the upper block is <strong>identical</strong> to the lower block, including orientation of each character.</p> + <div id="test" lang="ja"><span class="tcy">1</span>月<span class="tcy">2</span>日の次の日は、<br/><span class="tcy">1</span>月<span class="tcy">3</span>日です。</div> + <hr/> + <div id="control" lang="ja">1月2日の次の日は、<br/>1月3日です。</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-001.xht new file mode 100644 index 00000000000..59836b129d3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-001.xht @@ -0,0 +1,167 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: parsing text-combine-upright with invalid values</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<meta content="text-combine-upright doesn't support undefined keywords and out-of-range integer, and numbers." name="assert" /> +<meta content="dom invalid" name="flags" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<style> +#invalid_foo { + text-decoration-upright: foo; +} + +#invalid_all_none { + text-decoration-upright: all none; +} + +#invalid_none_digits { + text-decoration-upright: none digits; +} + +#invalid_digits_bar { + text-decoration-upright: digits bar; +} + +#invalid_digits_4_none { + text-decoration-upright: digits 4 none; +} + +#invalid_digits2 { + text-decoration-upright: digits2; +} + +#invalid_digits_1 { + text-decoration-upright: digits 1; +} + +#invalid_digits_positive5 { + text-decoration-upright: digits +5; +} + +#invalid_digits_2_00 { + text-decoration-upright: digits 2.00; +} + +#invalid_digits_2_e_0 { + text-decoration-upright: digits 2e0; +} + +#invalid_digits_positive2_e_0 { + text-decoration-upright: digits +2e0; +} + +#invalid_digits_3_e_positive0 { + text-decoration-upright: digits 3e+0; +} + +#invalid_digits_3_e_negative0 { + text-decoration-upright: digits 3e-0; +} + +#invalid_digits_positive4_e_positive0 { + text-decoration-upright: digits +4e+0; +} + +#invalid_digits_positive4_e_negative0 { + text-decoration-upright: digits +4e-0; +} +</style> +</head> +<body> + +<div id="invalid_foo"></div> +<div id="invalid_all_none"></div> +<div id="invalid_none_digits"></div> +<div id="invalid_digits_bar"></div> +<div id="invalid_digits_4_none"></div> +<div id="invalid_digits2"></div> +<div id="invalid_digits_1"></div> +<div id="invalid_digits_positive5"></div> +<div id="invalid_digits_2_00"></div> +<div id="invalid_digits_2_e_0"></div> +<div id="invalid_digits_positive2_e_0"></div> +<div id="invalid_digits_3_e_positive0"></div> +<div id="invalid_digits_3_e_negative0"></div> +<div id="invalid_digits_positive4_e_positive0"></div> +<div id="invalid_digits_positive4_e_negative0"></div> + +<div id="log"></div> + +<script> +var getComputedValueFor = function (id) { + var element = document.getElementById(id); + return window.getComputedStyle(element).textCombineUpright; +}; + +test(function () { + assert_equals(getComputedValueFor('invalid_foo'), 'none'); +}, 'Computed value for `text-combine-upright: foo` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_all_none'), 'none'); +}, 'Computed value for `text-combine-upright: all none` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_none_digits'), 'none'); +}, 'Computed value for `text-combine-upright: none digits` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_bar'), 'none'); +}, 'Computed value for `text-combine-upright: digits bar` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_4_none'), 'none'); +}, 'Computed value for `text-combine-upright: digits 4 none` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits2'), 'none'); +}, 'Computed value for `text-combine-upright: digits2` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_1'), 'none'); +}, 'Computed value for `text-combine-upright: digits 1` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_positive5'), 'none'); +}, 'Computed value for `text-combine-upright: digits +5` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_2_00'), 'none'); +}, 'Computed value for `text-combine-upright: digits 2.00` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_2_e_0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_2_e_0'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits 2e0` is not `digits 2` but `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_positive2_e_0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_positive2_e_0'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits +2e0` is not `digits 2` but `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_3_e_positive0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_3_e_positive0'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits 3e+0` is not `digits 3` but `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_3_e_negative0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_3_e_negative0'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits 3e-0` is not `digits 3` but `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_positive4_e_positive0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_positive4_e_positive0'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits +4e+0` is not `digits 4` but `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_positive4_e_negative0'), 'none'); + assert_not_equals(getComputedValueFor('invalid_digits_positive4_e_negative0'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits +4e-0` is not `digits 4` but `none`'); +</script> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-002.xht new file mode 100644 index 00000000000..63b9b25f3a0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-invalid-002.xht @@ -0,0 +1,126 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: parsing text-combine-upright with digits plus calc() computing to invalid digits</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="http://www.w3.org/TR/css-values-3/#calc-notation" rel="help" /> +<meta content="User Agents ignore text-combine-upright with values `digits calc(...)` if the expression inside `calc()` computes to either numbers or out-of-range integers." name="assert" /> +<meta content="dom invalid" name="flags" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<style> +#invalid_digits_calc_0_plus_1 { + text-combine-upright: digits calc(0 + 1); +} + +#invalid_digits_calc_2_plus_3 { + text-combine-upright: digits calc(2 + 3); +} + +#invalid_digits_calc_4_minus_3 { + text-combine-upright: digits calc(4 - 3); +} + +#invalid_digits_calc_10_minus_3 { + text-combine-upright: digits calc(10 - 3); +} + +#invalid_digits_calc_3_times_1_0 { + text-combine-upright: digits calc(3 * 1.0); +} + +#invalid_digits_calc_2_0_times_2 { + text-combine-upright: digits calc(2.0 * 2); +} + +#invalid_digits_calc_2_dividedby_1_0 { + text-combine-upright: digits calc(2 / 1.0); +} + +#invalid_digits_calc_4_0_dividedby_2 { + text-combine-upright: digits calc(4.0 / 2); +} + +#invalid_digits_calc_2_e_0_times_2_e_positive0 { + text-combine-upright: digits calc(2e0 * 2e+0); +} + +#invalid_digits_calc_2_e_2_times_2_e_negative2 { + text-combine-upright: digits calc(2e2 * 2e-2); +} + +#invalid_digits_calc_4_e_positive2_dividedby_positive2_e_2 { + text-combine-upright: digits calc(4e+2 / +2e2); +} +</style> +</head> +<body> + +<div id="invalid_digits_calc_0_plus_1"></div> +<div id="invalid_digits_calc_2_plus_3"></div> +<div id="invalid_digits_calc_4_minus_3"></div> +<div id="invalid_digits_calc_10_minus_3"></div> +<div id="invalid_digits_calc_3_times_1_0"></div> +<div id="invalid_digits_calc_2_0_times_2"></div> +<div id="invalid_digits_calc_2_dividedby_1_0"></div> +<div id="invalid_digits_calc_4_0_dividedby_2"></div> +<div id="invalid_digits_calc_2_e_0_times_2_e_positive0"></div> +<div id="invalid_digits_calc_2_e_2_times_2_e_negative2"></div> +<div id="invalid_digits_calc_4_e_positive2_dividedby_positive2_e_2"></div> + +<div id="log"></div> + +<script> +var getComputedValueFor = function (id) { + var element = document.getElementById(id); + return window.getComputedStyle(element).textCombineUpright; +}; + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_0_plus_1'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(0 + 1)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_2_plus_3'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(2 + 3)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_4_minus_3'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(4 - 3)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_10_minus_3'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(10 - 3)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_3_times_1_0'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(3 * 1.0)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_2_0_times_2'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(2.0 * 2)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_2_dividedby_1_0'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(2 / 1.0)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_4_0_dividedby_2'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(4.0 / 2)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_2_e_0_times_2_e_positive0'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(2e0 * 2e+0)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_2_e_2_times_2_e_negative2'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(2e2 * 2e-2)` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('invalid_digits_calc_4_e_positive2_dividedby_positive2_e_2'), 'none'); +}, 'Computed value for `text-combine-upright: digits calc(4e+2 / +2e2)` is `none`'); +</script> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-001.xht new file mode 100644 index 00000000000..2a9d73bccdf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-001.xht @@ -0,0 +1,182 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: parsing text-combine-upright with valid values</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<meta content="text-combine-upright supports `none`, `all`, `digits`, and `digits` followed by a digit in the range from 2 to 4." name="assert" /> +<meta content="dom" name="flags" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<style> +#valid_none { + text-combine-upright: none; +} + +#valid_all { + text-combine-upright: all; +} + +#valid_digits { + text-combine-upright: digits; +} + +#valid_digits_2 { + text-combine-upright: digits 2; +} + +#valid_digits_3 { + text-combine-upright: digits 3; +} + +#valid_digits_4 { + text-combine-upright: digits 4; +} + +#valid_digits_positive2 { + text-combine-upright: digits +2; +} + +#valid_digits_positive3_nospace { + text-combine-upright: digits+3; +} + +#valid_digits_tab_4_nospace { + text-combine-upright: digits 4; +} + +#valid_digits_lf_2_nospace { + text-combine-upright: digits +2; +} + +#valid_digits_tab_3 { + text-combine-upright: digits 3; +} + +#valid_digits_tab_lf_4_nospace { + text-combine-upright: digits +4; +} + +#valid_initial { + text-combine-upright: initial; +} + +#valid_inherit_outer { + text-combine-upright: digits 2; +} + +#valid_inherit_inner { + text-combine-upright: inherit; +} + +#valid_unset_outer { + text-combine-upright: digits 4; +} + +#valid_unset_inner { + text-combine-upright: unset; +} +</style> +</head> +<body> + +<div id="valid_none"></div> +<div id="valid_all"></div> +<div id="valid_digits"></div> +<div id="valid_digits_2"></div> +<div id="valid_digits_3"></div> +<div id="valid_digits_4"></div> +<div id="valid_digits_positive2"></div> +<div id="valid_digits_positive3_nospace"></div> +<div id="valid_digits_tab_4_nospace"></div> +<div id="valid_digits_lf_2_nospace"></div> +<div id="valid_digits_tab_3"></div> +<div id="valid_digits_tab_lf_4_nospace"></div> + +<div id="valid_initial"></div> + +<div id="valid_inherit_outer"> + <div id="valid_inherit_inner"></div> +</div> + +<div id="valid_unset_outer"> + <div id="valid_unset_inner"></div> +</div> + +<div id="log"></div> + +<script> +var getComputedValueFor = function (id) { + var element = document.getElementById(id); + return window.getComputedStyle(element).textCombineUpright; +}; + +test(function () { + assert_equals(getComputedValueFor('valid_none'), 'none'); +}, 'Computed value for `text-combine-upright: none` is `none`'); + +test(function () { + assert_equals(getComputedValueFor('valid_all'), 'all'); +}, 'Computed value for `text-combine-upright: all` is `all`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_2'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits 2` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_3'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits 3` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_4'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits 4` is `digits 4`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_positive2'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits +2` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_positive3_nospace'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits+3` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_tab_4_nospace'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits[TAB]4` is `digits 4`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_lf_2_nospace'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits[LF]2` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_tab_3'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits [TAB]3` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_tab_lf_4_nospace'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits[TAB][LF]4` is `digits 4`'); + + +test(function () { + assert_equals(getComputedValueFor('valid_initial'), 'none'); +}, 'Computed value for `text-combine-upright: initial` is `none`'); + + +test(function () { + assert_equals(getComputedValueFor('valid_inherit_outer'), 'digits 2'); + assert_equals(getComputedValueFor('valid_inherit_inner'), 'digits 2'); +}, 'Computed value for `text-combine-upright: inherit` is `digits 2` which is inherited from the parent element'); + +test(function () { + assert_equals(getComputedValueFor('valid_unset_outer'), 'digits 4'); + assert_equals(getComputedValueFor('valid_unset_inner'), 'digits 4'); +}, 'Computed value for `text-combine-upright: unset` is `digits 4` which is inherited from the parent element'); +</script> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-002.xht new file mode 100644 index 00000000000..7cf7e2842f8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-combine-upright-parsing-valid-002.xht @@ -0,0 +1,136 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: parsing text-combine-upright with digits plus calc() computing to valid digits</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="http://www.w3.org/TR/css-values-3/#calc-notation" rel="help" /> +<meta content="User Agents support text-combine-upright with values `digits calc(...)` if the expression inside `calc()` computes to a valid integer, which is either 2, 3, or 4." name="assert" /> +<meta content="dom" name="flags" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<style> +#valid_digits_calc_1_plus_1 { + text-combine-upright: digits calc(1 + 1); +} + +#valid_digits_calc_1_plus_1_plus_1 { + text-combine-upright: digits calc(1 + 1 + 1); +} + +#valid_digits_calc_2_plus_2 { + text-combine-upright: digits calc(2 + 2); +} + +#valid_digits_calc_4_minus_2 { + text-combine-upright: digits calc(4 - 2); +} + +#valid_digits_calc_6_minus_3 { + text-combine-upright: digits calc(6 - 3); +} + +#valid_digits_calc_7_minus_1_minus_2 { + text-combine-upright: digits calc(7 - 1 - 2); +} + +#valid_digits_calc_2_times_1 { + text-combine-upright: digits calc(2 * 1); +} + +#valid_digits_calc_3_times_1 { + text-combine-upright: digits calc(3 * 1); +} + +#valid_digits_calc_2_times_2_times_1 { + text-combine-upright: digits calc(2 * 2 * 1); +} + +#valid_digits_calc_4_dividedby_2 { + text-combine-upright: digits calc(4 / 2); +} + +#valid_digits_calc_4_dividedby_2 { + text-combine-upright: digits calc(6 / 2); +} + +#valid_digits_calc_24_dividedby_3_dividedby_2 { + text-combine-upright: digits calc(24 / 3 / 2); +} + +</style> +</head> +<body> + +<div id="valid_digits_calc_1_plus_1"></div> +<div id="valid_digits_calc_1_plus_1_plus_1"></div> +<div id="valid_digits_calc_2_plus_2"></div> +<div id="valid_digits_calc_4_minus_2"></div> +<div id="valid_digits_calc_6_minus_3"></div> +<div id="valid_digits_calc_7_minus_1_minus_2"></div> +<div id="valid_digits_calc_2_times_1"></div> +<div id="valid_digits_calc_3_times_1"></div> +<div id="valid_digits_calc_2_times_2_times_1"></div> +<div id="valid_digits_calc_4_dividedby_2"></div> +<div id="valid_digits_calc_4_dividedby_2"></div> +<div id="valid_digits_calc_24_dividedby_3_dividedby_2"></div> + +<div id="log"></div> + +<script> +var getComputedValueFor = function (id) { + var element = document.getElementById(id); + return window.getComputedStyle(element).textCombineUpright; +}; + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_1_plus_1'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits calc(1 + 1)` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_1_plus_1_plus_1'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits calc(1 + 1 + 1)` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_2_plus_2'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits calc(2 + 2)` is `digits 4`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_4_minus_2'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits calc(4 - 2)` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_6_minus_3'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits calc(6 - 3)` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_7_minus_1_minus_2'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits calc(7 - 1 - 2)` is `digits 4`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_2_times_1'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits calc(2 * 1)` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_3_times_1'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits calc(3 * 1)` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_2_times_2_times_1'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits calc(2 * 2 * 1)` is `digits 4`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_4_dividedby_2'), 'digits 2'); +}, 'Computed value for `text-combine-upright: digits calc(4 / 2)` is `digits 2`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_4_dividedby_2'), 'digits 3'); +}, 'Computed value for `text-combine-upright: digits calc(6 / 2)` is `digits 3`'); + +test(function () { + assert_equals(getComputedValueFor('valid_digits_calc_24_dividedby_3_dividedby_2'), 'digits 4'); +}, 'Computed value for `text-combine-upright: digits calc(24 / 3 / 2)` is `digits 4`'); +</script> + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-decoration-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-decoration-001.xht new file mode 100644 index 00000000000..c5ad1af66f7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-decoration-001.xht @@ -0,0 +1,30 @@ +<!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: text-combine-upright with text-decoration</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> + <link href="reference/text-decoration-001-ref.xht" rel="match" /> + <meta content="Test passes if text decoration applies to the composed character but each character inside tate-chu-yoko." name="assert" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-with-decoration { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + text-decoration: underline; + } + </style> +</head> +<body> + <p>Test passes if this figure and the emphasis are idencial</p> + <div class="tcu-with-decoration"> + 44 + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-emphasis-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-emphasis-001.xht new file mode 100644 index 00000000000..41fbc16a485 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-emphasis-001.xht @@ -0,0 +1,31 @@ +<!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: text-combine-upright with text-emphasis</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> + <link href="reference/text-emphasis-001-ref.xht" rel="match" /> + <link href="reference/text-emphasis-001-notref.xht" rel="mismatch" /> + <meta content="Test passes if text emphasis applies to the composed character but each character inside tate-chu-yoko." name="assert" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-with-emphasis { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + text-emphasis-style: open dot ; + } + </style> +</head> +<body> + <p>Test passes if this figure and the emphasis are idencial</p> + <div class="tcu-with-emphasis"> + 44 + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-010.xht new file mode 100644 index 00000000000..b5b5ff457ad --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-010.xht @@ -0,0 +1,79 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - mixed</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-010-ref.xht"/> + <meta http-equiv="content-language" content="en, ja"/> + <meta name="flags" content="ahem font"/> + <meta name="assert" content="This test checks that 'text-orientation: mixed' causes characters from horizontal-only scripts are set sideways, i.e. 90°clockwise from their standard orientation in horizontal text. Characters from vertical scripts are set with their intrinsic orientation. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: mixed; //The property to be tested + writing-mode: vertical-rl; + } + #control_ahem + { + writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + } + #test + { + text-orientation: mixed; //The property to be tested + } + #control + { + text-combine-horizontal: none; + } + </style> + </head> + <body xml:lang="en"> + <!-- + This test consists of a pair of sub-tests which complements each other. + Logically, the test should verify 1.block flow direction, 2.inline direction + and 3.glyph orientation. The "Ahem" sub-test comes first and checks 1. and 2. , + whereas "glyph" sub-test comes later and also checks 3. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span id="test_ahem">123 + 56 +7 </span></div> + <div class="view_ahem"><span id="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view" xml:lang="ja"><span id="test">月火水Abc<br/>def木金土</span></div> + <div class="view" xml:lang="ja"><span id="control">月火水Abc<br/>def木金土</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-011.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-011.xht new file mode 100644 index 00000000000..915a5926821 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-011.xht @@ -0,0 +1,87 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - upright</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-011-ref.xht"/> + <meta http-equiv="content-language" content="en, ja"/> + <meta name="flags" content="ahem font"/> + <meta name="assert" content="This test checks that 'text-orientation: upright' causes characters from horizontal-only scripts are rendered upright, i.e. in their standard horizontal orientation, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("support/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: upright; //The property to be tested + -webkit-text-orientation: upright; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-family: "mplus-1p-regular"; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #test + { + text-orientation: upright; //The property to be tested + -webkit-text-orientation: upright; + } + #control + { + } + .tcy /* tate-cyu-yoko: horizontal-in-vertical */ + { + text-combine-horizontal: all; + } + </style> + </head> + <body lang="en"> + <!-- + This test consists of a pair of sub-tests which complements each other. + Logically, the test should verify 1.block flow direction, 2.inline direction + and 3.glyph orientation. The "Ahem" sub-test comes first and checks 1. and 2. , + whereas "glyph" sub-test comes later and also checks 3. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span id="test_ahem">123 + 56 +7 </span></div> + <div class="view_ahem"><span id="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view" lang="ja"><span id="test">月火水Abc<br/>def木金土</span></div> + <div class="view" lang="ja"><span id="control">月火水<span class="tcy">A</span><span class="tcy">b</span><span class="tcy">c</span><br/><span class="tcy">d</span><span class="tcy">e</span><span class="tcy">f</span>木金土</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-012.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-012.xht new file mode 100644 index 00000000000..eef6af12099 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-012.xht @@ -0,0 +1,74 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways-right</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-012-ref.xht"/> + <meta http-equiv="content-language" content="en"/> + <meta name="flags" content="ahem"/> + <meta name="assert" content="This test checks that 'text-orientation: sideways-right' causes text to be set as if in a horizontal layout, but rotated 90° clockwise, in vertical writing modes. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: sideways-right; //The property to be tested + -webkit-text-orientation:sideways-right; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #test + { + text-orientation: sideways-right; //The property to be tested + -webkit-text-orientation:sideways-right; + } + #control + { + text-combine-horizontal: none; + } + </style> + </head> + <body lang="en"> + <!-- + This test consists of a pair of sub-tests which complements each other. + Logically, the test should verify 1.block flow direction, 2.inline direction + and 3.glyph orientation. The "Ahem" sub-test comes first and checks 1. and 2. , + whereas "glyph" sub-test comes later and also checks 3. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span id="test_ahem">123 + 56 +7 </span></div> + <div class="view_ahem"><span id="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view"><span id="test">123Abc<br/>def456</span></div> + <div class="view"><span id="control">123Abc<br/>def456</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-013.xht new file mode 100644 index 00000000000..d23b3cb5d02 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-013.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways-left</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-013-ref.xht"/> + <meta http-equiv="content-language" content="en"/> + <meta name="flags" content="ahem"/> + <meta name="assert" content="This test checks that 'text-orientation: sideways-left' causes text to be set as if in a horizontal layout, but rotated 90°counter-clockwise, in vertical writing modes. It's effective to verify 1.block flow direction and 2.inline direction, but not effective to verify 3.glyph orientation."/> + <style type="text/css"> + div + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 Ahem; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: sideways-left; //This property to be tested + -webkit-text-orientation: sideways-left; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + </style> + </head> + <body> + <!-- + Here, the "Ahem" sub-test is in place and checks 1.block flow direction and 2.inline direction, + but not cheks 3.glyph orientation. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong>.</p> + <div id="test_ahem">123 + 56 +7 </div> + <div id="control_ahem"> 63 + 52 +7 1</div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-014.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-014.xht new file mode 100644 index 00000000000..541c4ed1023 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-014.xht @@ -0,0 +1,74 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-014-ref.xht"/> + <meta http-equiv="content-language" content="en"/> + <meta name="flags" content="ahem"/> + <meta name="assert" content="This test checks that 'text-orientation: sideways' is equivalent to‘sideways-right’in‘vertical-rl’writing mode. This is effective to verify 1.block flow direction, 2.inline direction and 3.glyph orientation."/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: sideways; //The property to be tested + -webkit-text-orientation: sideways; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + .view + { + border: 1px solid gray; + font-size: 1.5em; + line-height: 1.5; + margin-bottom: 10px; + width: 3em; + writing-mode: vertical-rl; + -webkit-writing-mode: vertical-rl; + } + #test + { + text-orientation: sideways; //The property to be tested + -webkit-text-orientation: sideways; + } + #control + { + text-combine-horizontal: none; + } + </style> + </head> + <body lang="en"> + <!-- + This test consists of a pair of sub-tests which complements each other. + Logically, the test should verify 1.block flow direction, 2.inline direction + and 3.glyph orientation. The "Ahem" sub-test comes first and checks 1. and 2. , + whereas "glyph" sub-test comes later and also checks 3. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong> and <strong>orientation</strong>.</p> + <div class="view_ahem"><span id="test_ahem">123 + 56 +7 </span></div> + <div class="view_ahem"><span id="control_ahem">7 1 + 52 + 63</span></div> + <hr/> + <div class="view"><span id="test">123Abc<br/>def456</span></div> + <div class="view"><span id="control">123Abc<br/>def456</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-015.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-015.xht new file mode 100644 index 00000000000..95ea878bf16 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-015.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways</title> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com"/> + <link rel="help" title="5.1. Orienting Text: the‘text-orientation’property" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-015-ref.xht"/> + <meta http-equiv="content-language" content="en"/> + <meta name="flags" content="ahem"/> + <meta name="assert" content="This test checks that 'text-orientation: sideways' is equivalent to‘sideways-left’in‘vertical-lr’writing mode. This is effective to verify 1.block flow direction, 2.inline direction, but not effetive to verify 3.glyph orientation."/> + <style type="text/css"> + .view_ahem + { + background: pink; + border: 1px solid black; + color: blue; + font: 20px/1 "Ahem"; + height: 3em; + margin: 10px; + width: 3em; + white-space: pre; + } + #test_ahem + { + text-orientation: sideways; //The property to be tested + -webkit-text-orientation:sideways; + writing-mode: vertical-lr; + -webkit-writing-mode: vertical-lr; + } + #control_ahem + { + writing-mode: horizontal-tb; + -webkit-writing-mode: horizontal-tb; + } + </style> + </head> + <body lang="en"> + <!-- + Here, the "Ahem" sub-test is in place and checks 1.block flow direction and 2.inline direction, + but not cheks 3.glyph orientation. + --> + <p>Test passes if a pair of rectangles is <strong>identical</strong> including <strong>layout</strong>.</p> + <div class="view_ahem"><span id="test_ahem">123 + 56 +7 </span></div> + <div class="view_ahem"><span id="control_ahem">36 +25 +1 7</span></div> + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-mixed-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-mixed-001.xht new file mode 100644 index 00000000000..ef006c734b5 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-mixed-001.xht @@ -0,0 +1,58 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - mixed in vertical-rl writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-mixed-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="This test checks that the alphabet is displayed on sideways, and it is verified whether the characters are aligned in the vertical direction including vertical writing characters (Japanese, Mongolian, Hangul, etc)."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-rl; + -moz-writing-mode: vertical-rl; + -o-writing-mode: vertical-rl; + -ms-writing-mode: vertical-rl; + writing-mode: vertical-rl; + -webkit-text-orientation: mixed; + -moz-text-orientation: mixed; + -o-text-orientation: mixed; + -ms-text-orientation: mixed; + text-orientation: mixed; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: only "T" should be displayed vertically and "ext Sample" should be displayed sideways.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-mixed-001.png" width="42" height="189" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-001.xht new file mode 100644 index 00000000000..f114a21d623 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways in vertical-rl writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-sideways-right-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="This test checks that the same as [text-orientation: sideways-right], general horizontal text(include Japanese,etc) rotates 90 degrees clockwise, and it is verified whether the characters are aligned in the vertical direction."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-rl; + -moz-writing-mode: vertical-rl; + -o-writing-mode: vertical-rl; + -ms-writing-mode: vertical-rl; + writing-mode: vertical-rl; + -webkit-text-orientation: sideways; + -moz-text-orientation: sideways; + -o-text-orientation: sideways; + -ms-text-orientation: sideways; + text-orientation: sideways; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees clockwise.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-sideways-right-001.png" width="42" height="184" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-002.xht new file mode 100644 index 00000000000..656881c74c8 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-002.xht @@ -0,0 +1,58 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways in vertical-lr writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-sideways-left-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="This test checks that the same as [text-orientation: sideways-left], general horizontal text(include Japanese,etc) rotates 90 degrees counter-clockwise, and it is verified whether the characters are aligned in the vertical direction."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-lr; + -moz-writing-mode: vertical-lr; + -o-writing-mode: vertical-lr; + -ms-writing-mode: vertical-lr; + writing-mode: vertical-lr; + -webkit-text-orientation: sideways; + -moz-text-orientation: sideways; + -o-text-orientation: sideways; + -ms-text-orientation: sideways; + text-orientation: sideways; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees counter-clockwise.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-sideways-left-001.png" width="42" height="184" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-left-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-left-001.xht new file mode 100644 index 00000000000..de552880649 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-left-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways-left in vertical-rl writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-sideways-left-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="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."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-rl; + -moz-writing-mode: vertical-rl; + -o-writing-mode: vertical-rl; + -ms-writing-mode: vertical-rl; + writing-mode: vertical-rl; + -webkit-text-orientation: sideways-left; + -moz-text-orientation: sideways-left; + -o-text-orientation: sideways-left; + -ms-text-orientation: sideways-left; + text-orientation: sideways-left; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees counter-clockwise.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-sideways-left-001.png" width="42" height="184" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-right-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-right-001.xht new file mode 100644 index 00000000000..d903435f443 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-sideways-right-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - sideways-right in vertical-rl writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-sideways-right-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="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."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-rl; + -moz-writing-mode: vertical-rl; + -o-writing-mode: vertical-rl; + -ms-writing-mode: vertical-rl; + writing-mode: vertical-rl; + -webkit-text-orientation: sideways-right; + -moz-text-orientation: sideways-right; + -o-text-orientation: sideways-right; + -ms-text-orientation: sideways-right; + text-orientation: sideways-right; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed rotates 90 degrees clockwise.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-sideways-right-001.png" width="42" height="184" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-upright-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-upright-001.xht new file mode 100644 index 00000000000..27434e459fd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/text-orientation-upright-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Test: text-orientation - upright in vertical-rl writing mode</title> + <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp"/> + <link rel="help" title="5.1. Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation"/> + <link rel="match" href="reference/text-orientation-upright-001-ref.xht"/> + <meta name="flags" content="font image"/> + <meta name="assert" content="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)."/> + <style type="text/css"><![CDATA[ + @font-face + { + font-family: "DejaVuSerifBook"; + src: url("support/DejaVuSerif-webfont.woff") format("woff"); + /* Filesize: 18096 bytes (17.7 KBytes) */ + } + + div { + border: 1px solid gray; + float: left; + color: blue; + font-family: "DejaVuSerifBook"; + font-size: 1.875em; /* equivalent to 30px */ + line-height: 1.4; /* equivalent to 42px: + so that top-half-leading is 6px + and bottom-half-leading is 6px */ + margin: 10px; + } + + div#vertical + { + -webkit-writing-mode: vertical-rl; + -moz-writing-mode: vertical-rl; + -o-writing-mode: vertical-rl; + -ms-writing-mode: vertical-rl; + writing-mode: vertical-rl; + -webkit-text-orientation: upright; + -moz-text-orientation: upright; + -o-text-orientation: upright; + -ms-text-orientation: mixed; + text-orientation: upright; + } + + img {vertical-align: top;} + + ]]></style> + </head> + <body> + + <p>Test passes if both "Text sample" rectangles are <strong>identical</strong>: "Text sample" should be displayed on the upright.</p> + + <div id="vertical">Ｔext sample</div> + + <div><img src="./support/text-orientation-upright-001.png" width="42" height="349" alt="Image download support must be enabled"/></div> + + </body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/toc.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/toc.xht new file mode 100644 index 00000000000..48ef06c513f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/toc.xht @@ -0,0 +1,84 @@ + +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Writing Modes Module Level 3 CR Test Suite</title> + <style type="text/css"> + @import "http://www.w3.org/StyleSheets/TR/base.css"; + @import "../indices.css"; + </style> + </head> +<body> + <h1>CSS Writing Modes Module Level 3 CR Test Suite By Chapter</h1> + + <p>This index contains both + <a href="http://wiki.csswg.org/test/selftest">self-describing tests</a> + and reftests. + A separate <a href="reftest-toc.xht">alphabetical reftest index</a> + is provided for tests in <a href="http://wiki.csswg.org/test/reftest">reftest + format</a> along with the <a href="reftest.list">reftest manifest</a>.</p> + + <table> + <tbody id="s1"> + <tr><th><a href="chapter-1.xht">Chapter 1 - + Introduction to Writing Modes</a></th> + <td>(0 Tests)</td></tr> + </tbody> + <tbody id="s2"> + <tr><th><a href="chapter-2.xht">Chapter 2 - + Inline Direction and Bidirectionality</a></th> + <td>(101 Tests)</td></tr> + </tbody> + <tbody id="s3"> + <tr><th><a href="chapter-3.xht">Chapter 3 - + Introduction to Vertical Text</a></th> + <td>(76 Tests)</td></tr> + </tbody> + <tbody id="s4"> + <tr><th><a href="chapter-4.xht">Chapter 4 - + Inline-level Alignment</a></th> + <td>(75 Tests)</td></tr> + </tbody> + <tbody id="s5"> + <tr><th><a href="chapter-5.xht">Chapter 5 - + Introduction to Vertical Text Layout</a></th> + <td>(12 Tests)</td></tr> + </tbody> + <tbody id="s6"> + <tr><th><a href="chapter-6.xht">Chapter 6 - + Abstract Box Terminology</a></th> + <td>(4 Tests)</td></tr> + </tbody> + <tbody id="s7"> + <tr><th><a href="chapter-7.xht">Chapter 7 - + Abstract Box Layout</a></th> + <td>(229 Tests)</td></tr> + </tbody> + <tbody id="s8"> + <tr><th><a href="chapter-8.xht">Chapter 8 - + Page Flow: the page progression direction</a></th> + <td>(0 Tests)</td></tr> + </tbody> + <tbody id="s9"> + <tr><th><a href="chapter-9.xht">Chapter 9 - + Glyph Composition</a></th> + <td>(26 Tests)</td></tr> + </tbody> + <tbody id="sA"> + <tr><th><a href="chapter-A.xht">Appendix A - + Characters and Properties</a></th> + <td>(0 Tests)</td></tr> + </tbody> + <tbody id="sB"> + <tr><th><a href="chapter-B.xht">Appendix B - + Bidi Rules for HTML 4</a></th> + <td>(0 Tests)</td></tr> + </tbody> + <tbody id="sC"> + <tr><th><a href="chapter-C.xht">Appendix C - + Vertical Scripts in Unicode</a></th> + <td>(0 Tests)</td></tr> + </tbody> + </table> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-002.xht new file mode 100644 index 00000000000..88162951302 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-002.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: all</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: all' combines all characters inside the element which the declaration applied horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">ABC</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-003.xht new file mode 100644 index 00000000000..983abecb4fe --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-003.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: all</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: all' combines all characters inside the element which the declaration applied horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">ABCDE</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-and-inherit-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-and-inherit-001.xht new file mode 100644 index 00000000000..620ccd905ee --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-all-and-inherit-001.xht @@ -0,0 +1,39 @@ +<!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: text-combine-upright :all</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> + <link href="reference/value-all-and-inherit-001-ref.xht" rel="match" /> + <meta content="Two white triangles does not pointing to the right. Pointing up." name="assert" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-all { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: all; + } + </style> +</head> +<body> + <p>Test passes if the two white triangles are pointing to the right.</p> + <div class="tcu-all"> + <table> + <tbody><tr> + <td> + <div style="display: inline-table"> + <div style="display: inline-block"> + <p>2<span>2</span></p> + </div> + </div> + </td> + </tr> + </tbody></table> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digit2-and-inherit-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digit2-and-inherit-001.xht new file mode 100644 index 00000000000..63f86516a1e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digit2-and-inherit-001.xht @@ -0,0 +1,39 @@ +<!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: text-combine-upright :digit2</title> + <link href="mailto:shinsuke.matsuki@access-company.com" rel="author" title="Shinsuke Matsuki" /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> + <link href="reference/value-digit2-and-inherit-001-ref.xht" rel="match" /> + <meta content="Two white triangles does not pointing to the right. Pointing up." name="assert" /> + <meta charset="utf-8" /> + <style type="text/css"> + @font-face { + font-family: 'tcu-font'; + src: url('../support/tcu-font.woff'); + } + + .tcu-all { + font-family: 'tcu-font'; + writing-mode: vertical-rl; + text-combine-upright: digit 2; + } + </style> +</head> +<body> + <p>Test passes if the two white triangles are pointing to the right.</p> + <div class="tcu-all"> + <table> + <tbody><tr> + <td> + <div style="display: inline-table"> + <div style="display: inline-block"> + <p>2<span>2</span></p> + </div> + </div> + </td> + </tr> + </tbody></table> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-002.xht new file mode 100644 index 00000000000..12f5069fb90 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-002.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 2 + two digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 2' combines two ASCII digits horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 2; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">12</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-003.xht new file mode 100644 index 00000000000..61cb541b0f3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits2-003.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 2 + three digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x3-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x3-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 2' does not combine digits that are greater than two." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 2; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">123</span></p> + <p>xxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-001.xht new file mode 100644 index 00000000000..f4822549a8a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-001.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 3 + two digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 3' combines two ASCII digits horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 3; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">12</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-002.xht new file mode 100644 index 00000000000..39d86fe879f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-002.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 3 + three digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 3' combines three ASCII digits horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 3; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">123</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-003.xht new file mode 100644 index 00000000000..a74c2e8898a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits3-003.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 3 + four digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x4-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x4-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 3' does not combine digits that are greater than three." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 3; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">1234</span></p> + <p>xxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-001.xht new file mode 100644 index 00000000000..845a4331981 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-001.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 4 + three digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 4' combines three ASCII digits horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 4; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">123</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-002.xht new file mode 100644 index 00000000000..07434fc30b0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-002.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 4 + four digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x1-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x1-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 4' combines four ASCII digits horizontally." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 4; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">1234</span></p> + <p>x</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-003.xht new file mode 100644 index 00000000000..a3d5e0d0a91 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-digits4-003.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: digits 4 + five digits</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x5-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x5-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: digits 4' does not combine digits that are greater than four." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: digits 4; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">12345</span></p> + <p>xxxxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-none-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-none-001.xht new file mode 100644 index 00000000000..3e2fb7d4259 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/value-none-001.xht @@ -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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright: none</title> +<link href="https://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/vertical-ahem-1x3-ref.xht" rel="match" /> +<link href="reference/horizontal-ahem-1x3-notref.xht" rel="mismatch" /> +<meta content="'text-combine-upright: none' does not combine any characters in any circumstance." name="assert" /> +<meta content="ahem" name="flags" /> +<style> +.test { + writing-mode: vertical-rl; + font-size: 5em; + font-family: Ahem; +} + +.tcy { + text-combine-upright: none; +} +</style> +</head> +<body> + +<p>Test passes if there are 2 <strong>identical</strong> black rectangles.</p> + +<div class="test"> + <p><span class="tcy">A01</span></p> + <p>xxx</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-001.xht new file mode 100644 index 00000000000..07d885a3e2b --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-001.xht @@ -0,0 +1,91 @@ +<!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 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="reference/vertical-alignment-001-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="image" /> + <style type="text/css"><![CDATA[ + div > p, p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: baseline; + } + img.line { + margin-left: -230px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysleft.xht new file mode 100644 index 00000000000..24def26b4e6 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysright.xht new file mode 100644 index 00000000000..347a0e57e3c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-002-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-lr.xht new file mode 100644 index 00000000000..c762505e832 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-lr.xht @@ -0,0 +1,70 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-rl.xht new file mode 100644 index 00000000000..4e0b09a1606 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-003-rl.xht @@ -0,0 +1,70 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-004.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-004.xht new file mode 100644 index 00000000000..527f35673a3 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-004.xht @@ -0,0 +1,91 @@ +<!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 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="reference/vertical-alignment-004-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="image" /> + <style type="text/css"><![CDATA[ + div > p, p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: sub; + } + img.line { + margin-left: -230px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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"><sub>LLLLLLLLLLLLL</sub> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysleft.xht new file mode 100644 index 00000000000..cdc837130eb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysright.xht new file mode 100644 index 00000000000..1465a3efa27 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-005-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-lr.xht new file mode 100644 index 00000000000..b7a4275c817 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-lr.xht @@ -0,0 +1,70 @@ +<!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' (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: sub; + } + 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"><sub><span class="half">LLLLLLLLL</span></sub> + <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"><sub><span class="half">LLLLLLLLL</span></sub> + <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"><sub><span class="half">LLLLLLLLL</span></sub> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-rl.xht new file mode 100644 index 00000000000..c209088bc03 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-006-rl.xht @@ -0,0 +1,70 @@ +<!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' (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: sub; + } + 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"><sub><span class="half">LLLLLLLLL</span></sub> + <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"><sub><span class="half">LLLLLLLLL</span></sub> + <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"><sub><span class="half">LLLLLLLLL</span></sub> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-007.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-007.xht new file mode 100644 index 00000000000..a2155ed6c58 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-007.xht @@ -0,0 +1,91 @@ +<!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 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="reference/vertical-alignment-007-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="image" /> + <style type="text/css"><![CDATA[ + div > p, p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: super; + } + img.line { + margin-left: -230px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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"><sup>LLLLLLLLLLLLL</sup> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysleft.xht new file mode 100644 index 00000000000..347b0d77fdb --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysright.xht new file mode 100644 index 00000000000..274a4370161 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-008-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-lr.xht new file mode 100644 index 00000000000..c967a764077 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-lr.xht @@ -0,0 +1,70 @@ +<!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' (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: super; + } + 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"><sup><span class="half">LLLLLLLLL</span></sup> + <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"><sup><span class="half">LLLLLLLLL</span></sup> + <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"><sup><span class="half">LLLLLLLLL</span></sup> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-rl.xht new file mode 100644 index 00000000000..8a7eef78069 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-009-rl.xht @@ -0,0 +1,70 @@ +<!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' (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: super; + } + 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"><sup><span class="half">LLLLLLLLL</span></sup> + <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"><sup><span class="half">LLLLLLLLL</span></sup> + <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"><sup><span class="half">LLLLLLLLL</span></sup> + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-010.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-010.xht new file mode 100644 index 00000000000..55cf1d0233f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-010.xht @@ -0,0 +1,91 @@ +<!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 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="reference/vertical-alignment-010-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="image" /> + <style type="text/css"><![CDATA[ + div > p, p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0em; + } + img.line { + margin-left: -230px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysleft.xht new file mode 100644 index 00000000000..3d8fe462502 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysright.xht new file mode 100644 index 00000000000..4ac7e74083a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-011-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-lr.xht new file mode 100644 index 00000000000..742df4cb701 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-lr.xht @@ -0,0 +1,70 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-rl.xht new file mode 100644 index 00000000000..92df052439a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-012-rl.xht @@ -0,0 +1,70 @@ +<!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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-013.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-013.xht new file mode 100644 index 00000000000..1c8577f6f29 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-013.xht @@ -0,0 +1,91 @@ +<!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 - 'positive length (0.8em)' (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="reference/vertical-alignment-013-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 { + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0.8em; + } + img.line { + margin-left: -260px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the top 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysleft.xht new file mode 100644 index 00000000000..38521e02b5d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysright.xht new file mode 100644 index 00000000000..e030074b75d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-014-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-lr.xht new file mode 100644 index 00000000000..d4edf12be1f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-lr.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-rl.xht new file mode 100644 index 00000000000..63fcd72f9bf --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-015-rl.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-016.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-016.xht new file mode 100644 index 00000000000..253672f7199 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-016.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><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + <title>CSS Writing Modes Test: vertical align - 'negative length (-0.2em)' (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="reference/vertical-alignment-016-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: -0.2em; + } + img.line { + margin-left: -260px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysleft.xht new file mode 100644 index 00000000000..6179f07ab06 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysleft.xht @@ -0,0 +1,68 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysright.xht new file mode 100644 index 00000000000..38fbff0b7ba --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-017-sidewaysright.xht @@ -0,0 +1,68 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-lr.xht new file mode 100644 index 00000000000..3402f3a6e2c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-lr.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-rl.xht new file mode 100644 index 00000000000..c2b0721c546 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-018-rl.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-019.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-019.xht new file mode 100644 index 00000000000..40d868c4fdd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-019.xht @@ -0,0 +1,91 @@ +<!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 percentage (0%)' (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="reference/vertical-alignment-019-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="image" /> + <style type="text/css"><![CDATA[ + div > p, p.control { + font-size: 2em; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 0%; + } + img.line { + margin-left: -230px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the bottom of glyph 'L' is touching a thin blue line in each 7 orange rectangles and</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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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">LLLLLLLLLL + <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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysleft.xht new file mode 100644 index 00000000000..2fee81e5651 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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 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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysright.xht new file mode 100644 index 00000000000..f2a9fdd1fcd --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-020-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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 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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-lr.xht new file mode 100644 index 00000000000..06cc31cafd9 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-lr.xht @@ -0,0 +1,70 @@ +<!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 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"><![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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-rl.xht new file mode 100644 index 00000000000..164878cbb1e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-021-rl.xht @@ -0,0 +1,70 @@ +<!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 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"><![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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-022.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-022.xht new file mode 100644 index 00000000000..2f20f329852 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-022.xht @@ -0,0 +1,91 @@ +<!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 - 'positive percentage (80%)' (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="reference/vertical-alignment-022-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 { + font: 40px/1 "Ahem"; + background-color: orange; + } + + /* vertical-align */ + img { + vertical-align: 80%; + } + img.line { + margin-left: -260px; + } + + /* writing-mode property */ + .horizontal-tb { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></style> + </head> + <body> + <p>Test passes if ...</p> + <ol> + <li>the top 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysleft.xht new file mode 100644 index 00000000000..a6d090b2217 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysleft.xht @@ -0,0 +1,67 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysright.xht new file mode 100644 index 00000000000..27b6de4d61d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-023-sidewaysright.xht @@ -0,0 +1,67 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-lr.xht new file mode 100644 index 00000000000..8349488967d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-lr.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-rl.xht new file mode 100644 index 00000000000..775a8db8c7d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-024-rl.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-025.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-025.xht new file mode 100644 index 00000000000..d21c31b8983 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/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><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> + <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="reference/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 { + writing-mode: horizontal-tb; + } + + /* 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; + } + ]]></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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysleft.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysleft.xht new file mode 100644 index 00000000000..81aff9b7eb4 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysleft.xht @@ -0,0 +1,68 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysright.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysright.xht new file mode 100644 index 00000000000..0290befe85a --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-026-sidewaysright.xht @@ -0,0 +1,68 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-lr.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-lr.xht new file mode 100644 index 00000000000..14beed6e4e2 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-lr.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-rl.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-rl.xht new file mode 100644 index 00000000000..15732ad18e7 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/vertical-alignment-027-rl.xht @@ -0,0 +1,64 @@ +<!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 - '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"><![CDATA[ + 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>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001l.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001l.xht new file mode 100644 index 00000000000..ea50d8d253e --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001l.xht @@ -0,0 +1,30 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright in horizontal writing mode</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/writing-mode-horizontal-001l-ref.xht" rel="match" /> +<meta content="text-combine-upright does not have an effect in horizontal writing modes." name="assert" /> +<style> +.test { + writing-mode: horizontal-tb; + font-size: 5em; +} + +.tcy { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if the following texts are identical:</p> + +<div class="test"> + <p><span class="tcy">2014</span></p> + <p>2014</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001r.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001r.xht new file mode 100644 index 00000000000..dae3fbf02c0 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-horizontal-001r.xht @@ -0,0 +1,31 @@ +<!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 charset="utf-8" /> +<title>CSS Writing Modes: text-combine-upright in horizontal writing mode</title> +<link href="http://google.com/+MasatakaYakura" rel="author" title="Masataka Yakura" /> +<link href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright" rel="help" /> +<link href="reference/writing-mode-horizontal-001r-ref.xht" rel="match" /> +<meta content="text-combine-upright does not have an effect in horizontal writing modes." name="assert" /> +<style> +.test { + writing-mode: horizontal-tb; + font-size: 5em; + direction: rtl; +} + +.tcy { + text-combine-upright: all; +} +</style> +</head> +<body> + +<p>Test passes if the following texts are identical:</p> + +<div class="test"> + <p><span class="tcy">2014</span></p> + <p>2014</p> +</div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-stretch-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-stretch-001.xht new file mode 100644 index 00000000000..98b02d346b1 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-stretch-001.xht @@ -0,0 +1,57 @@ +<!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 Test: writing-mode vertical-lr and vertical-rl</title> + <link href="mailto:mitsuteru.s@gmail.com" rel="author" title="Mitsuteru Sawa" /> + <link href="mailto:jackalmage@gmail.com" rel="reviewer" title="Tab Atkins Jr." /> + <link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" /> + <link href="reference/writing-mode-stretch-001-ref.xht" rel="match" /> + <meta content="vertical-writing-mode flex items should stretch" name="assert" /> + <style> + .container { + display: flex; + width: 250px; + } + .vertical-rl { + writing-mode: vertical-rl; + } + .vertical-lr { + writing-mode: vertical-lr; + } + .item { + background-color: green; + } + .square { + height: 50px; + width: 50px; + } + .error { + position: absolute; + background-color: red; + height: 100px; + width: 250px; + z-index: -1; + } + </style> +</head> +<body> + <p>The test passes if you see a green rectangle and no red.</p> + <div class="test"> + <div class="error"></div> + <div class="container"> + <div class="horizontal item"> + <div class="square"></div> + <div class="square"></div> + </div> + <div class="vertical-rl item"> + <div class="square"></div> + <div class="square"></div> + </div> + <div class="vertical-lr item"> + <div class="square"></div> + <div class="square"></div> + </div> + </div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-lr-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-lr-002.xht new file mode 100644 index 00000000000..ad979b0a616 --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-lr-002.xht @@ -0,0 +1,44 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode: vertical-lr - basic inline case</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> + <link rel="help" title="CSS3 Writing modes: 3.1. Block Flow Direction: the 'writing-mode' property" href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode"/> + <link rel="match" href="reference/writing-mode-vertical-lr-002-ref.xht"/> + <meta name="flags" content="ahem"/> + <meta content="This tests the block flow direction. The writing mode is vertical, and the block flow is left to right."/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + white-space: pre; + width: 6em; + } + + #test + { + writing-mode: vertical-lr; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> + <div id="test">a bc +d e fg +hi +j klm +n oq r +st uv</div> +<div id="control">adhjns + i t +be ko +c lqu + f m v + g r</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-001.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-001.xht new file mode 100644 index 00000000000..5789cb7dd4d --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-001.xht @@ -0,0 +1,44 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode: vertical-rl - basic inline case</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> + <link rel="help" title="CSS3 Writing modes: 3.1. Block Flow Direction: the 'writing-mode' property" href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode"/> + <link rel="match" href="reference/writing-mode-vertical-rl-001-ref.xht"/> + <meta name="flags" content="ahem"/> + <meta content="This tests the block flow direction. The writing mode is vertical, and the block flow is right to left."/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + white-space: pre; + width: 6em; + } + + #test + { + writing-mode: vertical-rl; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> + <div id="test">ab cd +e fg h +i jkl +mn +o q rs +t uv</div> +<div id="control">tomiea + n b +uq jf +v kgc + r l d + s h</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-002.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-002.xht new file mode 100644 index 00000000000..bc08d965b6c --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-002.xht @@ -0,0 +1,43 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <title>CSS Test: writing-mode: vertical-rl - basic inline case</title> + <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp"/> + <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> + <link rel="help" title="CSS3 Writing modes: 3.1. Block Flow Direction: the 'writing-mode' property" href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode"/> + <link rel="match" href="reference/writing-mode-vertical-rl-002-ref.xht"/> + <meta name="flags" content="ahem"/> + <meta content="This tests the block flow direction. The writing mode is vertical, and the block flow is right to left."/> + <style type="text/css"><![CDATA[ + div + { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + width: 6em; + } + + #test + { + writing-mode: vertical-rl; + } + ]]></style> +</head> +<body> + <p>The upper block is identical to the lower block including each character positions.</p> + <div id="test">ab cd +e fg h +i jkl +mn o q +rs t +uv</div> +<div id="control">urmiea +vsn x + jf + tokgc + l d + q h</div> +</body> +</html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-003.xht b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-003.xht new file mode 100644 index 00000000000..00155c53d9f --- /dev/null +++ b/tests/wpt/css-tests/css-writing-modes-3_dev/xhtml1/writing-mode-vertical-rl-003.xht @@ -0,0 +1,82 @@ +<!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: writing-mode: horizontal-tb nested in vertical-rl</title> + <link href="mailto:toshihiro@kisaka.jp" rel="author" title="KISAKA Toshihiro" /> + <!-- You must have at least one spec link, but may have as many as are covered in the test. --> + <!-- Be sure to make the main testing area first in the order --> + <link href="http://www.w3.org/TR/css-writing-modes-3/#writing-mode" rel="help" /> + <!-- The match link is only required if this is a reftest --> + <link href="reference/writing-mode-vertical-rl-003-ref.xht" rel="match" /> + <meta content="ahem" name="flags" /> + <meta content="when child block has its own writing-mode, child block's writing-mode overwrites parent block's writing-mode." name="assert" /> + <style type="text/css"> + div { + writing-mode: vertical-rl; + } + + div p { + background: yellow; + color: blue; + font: 20px/1 Ahem; + height: 6em; + margin: 10px; + white-space: pre; + width: 6em; + } + + div p:nth-child(2) { + background: pink; + } + + p#test { + writing-mode: horizontal-tb; + } + </style> +</head> +<body> + <p>Upper three blocks are identical to the lower three blocks including each character positions.</p> + + <div> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + <p id="test">ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + </div> + + <div> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + <p> h s +d l r +cgk v + fj qu +b n +aeimot</p> + <p>ab cd +e fg h +i jkl +mn +o q rs +t uv</p> + </div> + + +</body></html>
\ No newline at end of file |
