new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-conditional-3/OWNERS
@@ -0,0 +1,2 @@
+@dbaron
+@frivoal
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/OWNERS
@@ -0,0 +1,1 @@
+@frivoal
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/multicol-basic-005.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>
+<title>CSS Multi-column Layout Test: -moz-columns as -moz-column-count (basic)</title>
+<link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com"/>
+<link rel="match" href="reference/multicol-basic-005-ref.xht"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#columns"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#column-count"/>
+<style type="text/css">
+div {
+ margin: 1em auto;
+ background: yellow;
+ border: thin solid black;
+ width: 600px;
+ -moz-columns: 3;
+ -moz-column-gap: 0;
+ -moz-column-rule: none;
+}
+</style>
+</head>
+<body>
+<div>This multicol element should have a width of 600 pixels and the content should be flowed into three -moz-columns with no gap or rule between them.</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/multicol-basic-006.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>
+<title>CSS Multi-column Layout Test: -moz-column-count (basic)</title>
+<link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com"/>
+<link rel="match" href="reference/multicol-basic-005-ref.xht"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#column-count"/>
+<style type="text/css">
+div {
+ margin: 1em auto;
+ background: yellow;
+ border: thin solid black;
+ width: 600px;
+ -moz-column-count: 3;
+ -moz-column-gap: 0;
+ -moz-column-rule: none;
+}
+</style>
+</head>
+<body>
+<div>This multicol element should have a width of 600 pixels and the content should be flowed into three -moz-columns with no gap or rule between them.</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/multicol-basic-007.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>
+<title>CSS Multi-column Layout Test: -moz-columns as -moz-column-width (basic)</title>
+<link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com"/>
+<link rel="match" href="reference/multicol-basic-005-ref.xht"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#columns"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#column-width"/>
+<style type="text/css">
+div {
+ margin: 1em auto;
+ background: yellow;
+ border: thin solid black;
+ width: 600px;
+ -moz-columns: 200px;
+ -moz-column-gap: 0;
+ -moz-column-rule: none;
+}
+</style>
+</head>
+<body>
+<div>This multicol element should have a width of 600 pixels and the content should be flowed into three -moz-columns with no gap or rule between them.</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/multicol-basic-008.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>
+<title>CSS Multi-column Layout Test: -moz-column-width (basic)</title>
+<link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com"/>
+<link rel="match" href="reference/multicol-basic-005-ref.xht"/>
+<link rel="help" href="https://www.w3.org/TR/css3-multicol/#column-width"/>
+<style type="text/css">
+div {
+ margin: 1em auto;
+ background: yellow;
+ border: thin solid black;
+ width: 600px;
+ -moz-column-width: 200px;
+ -moz-column-gap: 0;
+ -moz-column-rule: none;
+}
+</style>
+</head>
+<body>
+<div>This multicol element should have a width of 600 pixels and the content should be flowed into three -moz-columns with no gap or rule between them.</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-multicol-1/reference/multicol-basic-005-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>
+<title>multicol-000</title>
+<link rel="author" title="Hakon Wium Lie" href="mailto:howcome@opera.com"/>
+<style type="text/css">
+div {
+ margin: 1em auto;
+ background: yellow;
+ border: thin solid black;
+ width: 600px;
+ -moz-columns: 3;
+ -moz-column-gap: 0;
+ -moz-column-rule: none;
+}
+</style>
+</head>
+<body>
+<div>This multicol element should have a width of 600 pixels and the content should be flowed into three -moz-columns with no gap or rule between them.</div>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-namespaces-3/OWNERS
@@ -0,0 +1,3 @@
+@plinss
+@dbaron
+@fantasai
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-values-3/OWNERS
@@ -0,0 +1,6 @@
+@frivoal
+@dbaron
+@FremyCompany
+@plinss
+@tabatkins
+@fantasai
--- a/layout/reftests/w3c-css/received/css-values-3/ch-unit-001.html
+++ b/layout/reftests/w3c-css/received/css-values-3/ch-unit-001.html
@@ -3,35 +3,35 @@
<title>CSS Values and Units Test: support for the ch unit</title>
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
<link rel="help" href="https://drafts.csswg.org/css-values-3/#font-relative-lengths">
<meta name="flags" content="">
<link rel="match" href="reference/ch-unit-001-ref.html">
<meta name="assert" content="The ch unit is equal to the used advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it.">
<style>
span {
- background: green;
- color: green;
- top: 0; bottom: 0;
- position: absolute;
+ background: green;
+ color: green;
+ top: 0; bottom: 0;
+ position: absolute;
}
div {
- background: red;
- color: red;
- position: relative;
- height: 10ch;
- width: 5ch;
- float: left;
+ background: red;
+ color: red;
+ position: relative;
+ height: 10ch;
+ width: 5ch;
+ float: left;
}
div + div {
- width: auto;
+ width: auto;
}
div + div span {
- width: 5ch;
+ width: 5ch;
}
</style>
<body>
- <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
- <div><span>00000</span></div>
- <div><span></span>00000</div>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <div><span>00000</span></div>
+ <div><span></span>00000</div>
</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-values-3/ch-unit-002.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Values and Units Test: the ch unit in vertical orientation</title>
+<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
+<link rel="help" href="https://drafts.csswg.org/css-values-3/#font-relative-lengths">
+<link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#block-flow">
+<link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#text-orientation">
+<link rel="match" href="reference/ch-unit-002-ref.html">
+<meta name="assert" content="In vertical upright, the ch unit is equal to the used vertical advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it.">
+<style>
+span {
+ background: green;
+ color: green;
+ left: 0; right: 0;
+ position: absolute;
+}
+div {
+ background: red;
+ color: red;
+ position: relative;
+ height: 5ch;
+ width: 10ch;
+ writing-mode: vertical-rl;
+ text-orientation: upright;
+}
+
+div + div {
+ height: auto;
+}
+
+div + div span {
+ height: 5ch;
+}
+</style>
+<body>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <div><span>00000</span></div>
+ <div><span></span>00000</div>
+</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-values-3/ch-unit-003.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Values and Units Test: support for the ch unit</title>
+<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
+<link rel="help" href="https://drafts.csswg.org/css-values-3/#font-relative-lengths">
+<meta name="flags" content="">
+<link rel="match" href="reference/ch-unit-001-ref.html">
+<meta name="assert" content="In vertical mixed, The ch unit is equal to the used horizontal advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it.">
+<style>
+span {
+ background: green;
+ color: green;
+ left: 0; right: 0;
+ position: absolute;
+}
+div {
+ background: red;
+ color: red;
+ position: relative;
+ height: 5ch;
+ width: 10ch;
+ writing-mode: vertical-rl;
+ text-orientation: mixed;
+}
+
+div + div {
+ height: auto;
+}
+
+div + div span {
+ height: 5ch;
+}
+</style>
+<body>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <div><span>00000</span></div>
+ <div><span></span>00000</div>
+</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-values-3/ch-unit-004.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Values and Units Test: support for the ch unit</title>
+<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
+<link rel="help" href="https://drafts.csswg.org/css-values-3/#font-relative-lengths">
+<meta name="flags" content="">
+<link rel="match" href="reference/ch-unit-001-ref.html">
+<meta name="assert" content="In vertical sideways, The ch unit is equal to the used horizontal advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it.">
+<style>
+span {
+ background: green;
+ color: green;
+ left: 0; right: 0;
+ position: absolute;
+}
+div {
+ background: red;
+ color: red;
+ position: relative;
+ height: 5ch;
+ width: 10ch;
+ writing-mode: vertical-rl;
+ text-orientation: sideways;
+}
+
+div + div {
+ height: auto;
+}
+
+div + div span {
+ height: 5ch;
+}
+</style>
+<body>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <div><span>00000</span></div>
+ <div><span></span>00000</div>
+</body>
--- a/layout/reftests/w3c-css/received/css-values-3/reference/ch-unit-001-ref.html
+++ b/layout/reftests/w3c-css/received/css-values-3/reference/ch-unit-001-ref.html
@@ -1,18 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Values and Units Test Reference File</title>
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
-<meta name="flags" content="">
<style>
-div {
- background: green;
- height: 10ch;
- width: 10ch;
- float: left;
-}
-
+svg { width: 10ch; }
</style>
<body>
- <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
- <div></div>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <svg viewBox="0 0 100 100"><rect x="0" y="0" width="100" height="100" fill="green"></svg>
</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-values-3/reference/ch-unit-002-ref.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Values and Units Test Reference File</title>
+<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
+<style>
+svg {
+ width: 10ch;
+ writing-mode: vertical-rl;
+ text-orientation: upright;
+}
+</style>
+<body>
+ <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <svg viewBox="0 0 100 100"><rect x="0" y="0" width="100" height="100" fill="green"></svg>
+</body>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/OWNERS
@@ -0,0 +1,8 @@
+@kojiishi
+@fantasai
+@hshiozawa
+@myakura
+@snsk
+@r12a
+@plinss
+@upsuper
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-lr' - 'left: auto', 'width: auto' and 'right: auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left: auto', 'width: auto' and 'right: auto') whose containing block is the initial containing block must set 'left' to the static position. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
html
{
direction: ltr;
@@ -84,19 +84,17 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-005.xht
@@ -89,19 +89,17 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
background-color: red;
height: 100px;
- position: relative;
width: 100px;
- z-index: -1;
}
]]></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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-lr' - 'left' and 'width' are 'auto', 'right' is not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' and 'width' are 'auto' and 'right' is not 'auto') whose containing block is the initial containing block must set width to shrink-to-fit and then solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vlr-007.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-lr' - 'left' and 'right' are 'auto' and 'width' is not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' and 'right' are 'auto' and 'width' is not 'auto') whose containing block is the initial containing block and whose direction is 'ltr' must set left to static position and then solve for 'right'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
html
{
direction: ltr;
@@ -83,25 +83,23 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
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="green-overlapping-test"></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-013.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-013.xht
@@ -88,19 +88,17 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
background-color: red;
height: 100px;
- position: relative;
width: 100px;
- z-index: -1;
}
]]></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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-019.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-019.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-lr' - 'left' is 'auto', 'width' and 'right' are not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' is 'auto', 'width' and 'right' are not 'auto') whose containing block is the initial containing block must solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vlr-019.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-021.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vlr-021.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-lr' - 'left' is 'auto', 'width' and 'right' are not 'auto' with 'direction: rtl' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'rtl', then an absolutely positioned box (with 'left' is 'auto', 'width' and 'right' are not 'auto') whose containing block is the initial containing block must solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vlr-021.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-rl' - 'left: auto', 'width: auto' and 'right: auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left: auto', 'width: auto' and 'right: auto') whose containing block is the initial containing block must set 'left' to the static position. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
html
{
direction: ltr;
@@ -84,25 +84,23 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
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="green-overlapping-test"></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004.xht
@@ -89,19 +89,17 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
background-color: red;
height: 100px;
- position: relative;
width: 100px;
- z-index: -1;
}
]]></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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-006.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-rl' - 'left' and 'width' are 'auto', 'right' is not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' and 'width' are 'auto' and 'right' is not 'auto') whose containing block is the initial containing block must set width to shrink-to-fit and then solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vrl-006.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-010.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-010.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-rl' - 'left' and 'right' are 'auto', 'width' is not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' and 'right' are 'auto', 'width' is not 'auto') whose containing block is the initial containing block and whose direction is 'ltr' must set left to static position and then solve for 'right'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
html
{
direction: ltr;
@@ -83,25 +83,23 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
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="green-overlapping-test"></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-012.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-012.xht
@@ -88,19 +88,17 @@
====================
: width of containing block (width of Initial Containing Block)
*/
div#red-overlapped-reference
{
background-color: red;
height: 100px;
- position: relative;
width: 100px;
- z-index: -1;
}
]]></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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-018.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-018.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-rl' - 'left' is 'auto', 'width' and 'right' are not 'auto' with 'direction: ltr' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'ltr', then an absolutely positioned box (with 'left' is 'auto', 'width' and 'right' are not 'auto') whose containing block is the initial containing block must solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vrl-018.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-020.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/abs-pos-non-replaced-icb-vrl-020.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: position absolute and 'vertical-rl' - 'left' is 'auto', 'width' and 'right' are not 'auto' with 'direction: rtl' in initial containing 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that when the initial containing block's writing-mode is 'horizontal-tb' and its 'direction' is 'rtl', then an absolutely positioned box (with 'left' is 'auto', 'width' and 'right' are not 'auto') whose containing block is the initial containing block must solve for 'left'. Whether such absolutely positioned box's 'writing-mode' is vertical or not is irrelevant." name="assert" />
<style type="text/css"><![CDATA[
object#overlapping-green
{
height: 116px;
@@ -38,9 +38,9 @@
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div><object data="support/embedded-doc-abs-pos-non-replaced-icb-vrl-020.html" type="text/html" id="overlapping-green">This test requires a browser with capability to embed an HTML document thanks to the HTML <object> element.</object></div>
<div id="red-overlapped-reference"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-018.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-018.xht
@@ -5,17 +5,17 @@
<head>
<title>CSS Writing Modes Test: 'background-position: left top' and 'vertical-rl' when document root element does not fill viewport width</title>
<link rel="author" 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" />
<link rel="match" href="background-position-vrl-018-ref.xht" />
- <meta content="image interact" name="flags" />
+ <meta content="image" name="flags" />
<meta content="This test checks that 'background-position: left top' will make background-image start at left side of document root element (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-image: url("support/100x100-red.png");
background-position: left top;
background-repeat: repeat-y;
@@ -59,9 +59,9 @@
The image says:
Test passes if there is a <strong>no red</strong>.
-->
<div id="reference-overlapping-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-020.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-020.xht
@@ -5,17 +5,17 @@
<head>
<title>CSS Writing Modes Test: 'background-position: left center' and 'vertical-rl' when document root element does not fill viewport width</title>
<link rel="author" 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" />
<link rel="match" href="background-position-vrl-018-ref.xht" />
- <meta content="image interact" name="flags" />
+ <meta content="image" name="flags" />
<meta content="This test checks that 'background-position: left center' will make background-image start at left side of document root element (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-image: url("support/100x100-red.png");
background-position: left center;
background-repeat: repeat-y;
@@ -59,9 +59,9 @@
The image says:
Test passes if there is a <strong>no red</strong>.
-->
<div id="reference-overlapping-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-022.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/background-position-vrl-022.xht
@@ -5,17 +5,17 @@
<head>
<title>CSS Writing Modes Test: 'background-position: left bottom' and 'vertical-rl' when document root element does not fill viewport width</title>
<link rel="author" 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" />
<link rel="match" href="background-position-vrl-018-ref.xht" />
- <meta content="image interact" name="flags" />
+ <meta content="image" name="flags" />
<meta content="This test checks that 'background-position: left bottom' will make background-image start at left side of document root element (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-image: url("support/100x100-red.png");
background-position: left bottom;
background-repeat: repeat-y;
@@ -59,9 +59,9 @@
The image says:
Test passes if there is a <strong>no red</strong>.
-->
<div id="reference-overlapping-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -43,9 +43,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -43,9 +43,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -41,9 +41,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/baseline-inline-non-replaced-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -41,9 +41,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-003.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-lr' table with 'direction: ltr' (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/#logical-directions" title="6.2 Flow-relative Directions" />
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -61,9 +61,9 @@
<tr>
<td></td> <td></td> <td></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-005.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-lr' table with 'direction: ltr' (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/#logical-directions" title="6.2 Flow-relative Directions" />
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -61,9 +61,9 @@
<tr>
<td></td> <td id="eight"></td> <td></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-007.xht
@@ -9,17 +9,17 @@
<!--
Original (and horizontal-tb) test is
http://test.csswg.org/suites/css2.1/nightly-unstable/html4/border-conflict-element-001a.htm
-->
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -143,9 +143,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-009.xht
@@ -9,17 +9,17 @@
<!--
Original (and horizontal-tb) test is
http://test.csswg.org/suites/css2.1/nightly-unstable/html4/border-conflict-element-001c.htm
-->
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -144,9 +144,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-011.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-011.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-lr' table with 'direction: rtl' (complex)</title>
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -138,9 +138,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-013.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vlr-013.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - cell wins over row, cell wins over rowgroup and cell wins over table (compound)</title>
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that, in border-collapsing model, when 'border-style' values and 'border-width' values are identical, then the 'border-color' set on a cell wins over the 'border-color' set on a row (5th table), the 'border-color' set on a cell wins over the 'border-color' set on a row group (tfoot in 4th table, thead in 3rd table, tbody in 2nd table) and the 'border-color' set on a cell wins over the 'border-color' set on a table element (1st table)." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -179,9 +179,9 @@
</tbody>
</table>
<div id="reference-overlapped-red"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-002.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-rl' table with 'direction: ltr' (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/#logical-directions" title="6.2 Flow-relative Directions" />
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -61,9 +61,9 @@
<tr>
<td></td> <td></td> <td></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-004.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-rl' table with 'direction: ltr' (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/#logical-directions" title="6.2 Flow-relative Directions" />
<link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -61,9 +61,9 @@
<tr>
<td></td> <td id="eight"></td> <td></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-006.xht
@@ -9,17 +9,17 @@
<!--
Original (and horizontal-tb) test is
http://test.csswg.org/suites/css2.1/nightly-unstable/html4/border-conflict-element-001a.htm
-->
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -143,9 +143,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-008.xht
@@ -9,17 +9,17 @@
<!--
Original (and horizontal-tb) test is
http://test.csswg.org/suites/css2.1/nightly-unstable/html4/border-conflict-element-001c.htm
-->
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -144,9 +144,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-010.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-010.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - adjacent cells with same border styles in a 'vertical-rl' table with 'direction: rtl' (complex)</title>
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="When two adjacent cells have the same 'border-width' value and the same 'border-style' value in a 'border-collapse: collapse' table, then the color of the border of the cell closest to line-left side wins (if the table's 'direction' is 'ltr'; line-right side, if it is 'rtl') and the color of the border of the cell closest to block-start side wins." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -138,9 +138,9 @@
<tr>
<td id="thirteen"></td> <td id="fourteen"></td> <td id="fifteen"></td> <td id="sixteen"></td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-012.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/border-conflict-element-vrl-012.xht
@@ -4,17 +4,17 @@
<head>
<title>CSS Writing Modes Test: Border conflict resolution - cell wins over row, cell wins over rowgroup and cell wins over table (compound)</title>
<link rel="author" 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="help" href="http://www.w3.org/TR/CSS21/tables.html#border-conflict-resolution" title="17.6.2.1 Border conflict resolution" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that, in border-collapsing model, when 'border-style' values and 'border-width' values are identical, then the 'border-color' set on a cell wins over the 'border-color' set on a row (5th table), the 'border-color' set on a cell wins over the 'border-color' set on a row group (tfoot in 4th table, thead in 3rd table, tbody in 2nd table) and the 'border-color' set on a cell wins over the 'border-color' set on a table element (1st table)." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -179,9 +179,9 @@
</tbody>
</table>
<div id="reference-overlapped-red"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: 'caption-side: top' and vertical-lr</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#logical-direction-layout" title="7.4. Flow-Relative Mappings" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<meta content="This test checks that when 'caption-side' is set to 'top' in a vertical-lr table, then the caption is placed at the block-start side of the table, which is on the lefthand side of such table." name="assert" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -61,9 +61,9 @@
<tr>
<td>T</td><td>D</td>
</tr>
</table>
<div id="reference-overlapped-red"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: 'caption-side: bottom' and vertical-lr</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#logical-direction-layout" title="7.4. Flow-Relative Mappings" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<meta content="This test checks that when 'caption-side' is set to 'bottom' in a vertical-lr table, then the caption is placed at the block-end side of the table, which is on the righthand side of such table." name="assert" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -60,9 +60,9 @@
<table id="test-overlapping-green">
<caption>CA</caption>
<tr>
<td>T</td><td>D</td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: 'caption-side: top' and vertical-rl</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#logical-direction-layout" title="7.4. Flow-Relative Mappings" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<meta content="This test checks that when 'caption-side' is set to 'top' in a vertical-rl table, then the caption is placed at the block-start side of the table, which is on the righthand side of such table." name="assert" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -60,9 +60,9 @@
<table id="test-overlapping-green">
<caption>CA</caption>
<tr>
<td>T</td><td>D</td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/caption-side-vrl-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: 'caption-side: bottom' and vertical-rl</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
<link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#logical-direction-layout" title="7.4. Flow-Relative Mappings" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<meta content="This test checks that when 'caption-side' is set to 'bottom' in a vertical-rl table, then the caption is placed at the block-end side of the table, which is on the lefthand side of such table." name="assert" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -60,9 +60,9 @@
<table id="test-overlapping-green">
<caption>CA</caption>
<tr>
<td>T</td><td>D</td>
</tr>
</table>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: floated border-collapsing tables (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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that contiguous floated border-collapsing tables in a 'vertical-lr' context do not overlap." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-left: red solid 50px;
@@ -28,19 +28,17 @@
border-left: green solid 50px;
padding: 0px;
}
div#reference-overlapped-red
{
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: floated non-border-collapsing tables (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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that contiguous floated non-border-collapsing tables in a 'vertical-lr' context do not overlap." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: separate;
@@ -29,19 +29,17 @@
border-left: green solid 25px;
padding: 0px;
}
div#reference-overlapped-red
{
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-007.xht
@@ -8,17 +8,17 @@
Test inspired by
http://test.csswg.org/source/css-writing-modes-3/table-progression-vrl-004.html
-->
<title>CSS Writing Modes Test: vertical-lr - contiguous floated tables and horizontal 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="image" name="flags" />
<meta content="This test checks that horizontal margins existing between contiguous floated tables with writing-mode set to 'vertical-lr' are not substracted by the amount of their borders. In this test, there should be an horizontal gap of 50px separating both tables. Margins between 2 floated boxes do not collapse." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: separate;
@@ -46,19 +46,17 @@
}
div#reference-overlapped
{
background-color: red;
background-image: url("support/margin-collapse-2em-space-wm-vert.png");
background-repeat: no-repeat;
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vlr-009.xht
@@ -8,17 +8,17 @@
Test inspired by
http://test.csswg.org/source/css-writing-modes-3/table-progression-vrl-004.html
-->
<title>CSS Writing Modes Test: vertical-lr - contiguous floated tables and horizontal 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="image" name="flags" />
<meta content="This test checks that horizontal margins existing between contiguous floated tables with writing-mode set to 'vertical-lr' are not substracted by the amount of their horizontal padding. In this test, there should be an horizontal gap of 50px separating both tables. Margins between 2 floated boxes do not collapse." name="assert" />
<style type="text/css"><![CDATA[
table
{
background-color: green;
@@ -47,19 +47,17 @@
}
div#reference-overlapped
{
background-color: red;
background-image: url("support/margin-collapse-2em-space-wm-vert.png");
background-repeat: no-repeat;
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: floated border-collapsing tables (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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that contiguous floated border-collapsing tables in a 'vertical-rl' context do not overlap." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: collapse;
@@ -28,19 +28,17 @@
border-right: green solid 50px;
padding: 0px;
}
div#reference-overlapped-red
{
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Writing Modes Test: floated non-border-collapsing tables (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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="" name="flags" />
<meta content="This test checks that contiguous floated non-border-collapsing tables in a 'vertical-rl' context do not overlap." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-right: green solid 25px;
@@ -29,19 +29,17 @@
border-right: green solid 25px;
padding: 0px;
}
div#reference-overlapped-red
{
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-006.xht
@@ -8,17 +8,17 @@
Test inspired by
http://test.csswg.org/source/css-writing-modes-3/table-progression-vrl-004.html
-->
<title>CSS Writing Modes Test: vertical-rl - contiguous floated tables and horizontal 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="image" name="flags" />
<meta content="This test checks that horizontal margins existing between contiguous floated tables with writing-mode set to 'vertical-rl' are not substracted by the amount of their borders. In this test, there should be an horizontal gap of 50px separating both tables. Margins between 2 floated boxes do not collapse." name="assert" />
<style type="text/css"><![CDATA[
table
{
border-collapse: separate;
@@ -46,19 +46,17 @@
}
div#reference-overlapped
{
background-color: red;
background-image: url("support/margin-collapse-2em-space-wm-vert.png");
background-repeat: no-repeat;
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/contiguous-floated-table-vrl-008.xht
@@ -8,17 +8,17 @@
Test inspired by
http://test.csswg.org/source/css-writing-modes-3/table-progression-vrl-004.html
-->
<title>CSS Writing Modes Test: vertical-rl - contiguous floated tables and horizontal 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="image" name="flags" />
<meta content="This test checks that horizontal margins existing between contiguous floated tables with writing-mode set to 'vertical-rl' are not substracted by the amount of their horizontal padding. In this test, there should be an horizontal gap of 50px separating both tables. Margins between 2 floated boxes do not collapse." name="assert" />
<style type="text/css"><![CDATA[
table
{
background-color: green;
@@ -47,19 +47,17 @@
}
div#reference-overlapped
{
background-color: red;
background-image: url("support/margin-collapse-2em-space-wm-vert.png");
background-repeat: no-repeat;
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>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/different-block-flow-dir-001.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/different-block-flow-dir-001.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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;
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/different-block-flow-dir-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/different-block-flow-dir-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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;
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/direction-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/direction-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -39,9 +39,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-007.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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");
@@ -51,9 +51,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vlr-009.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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");
@@ -58,9 +58,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-006.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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");
@@ -51,9 +51,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-clear-vrl-008.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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");
@@ -58,9 +58,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-contiguous-vlr-011.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-contiguous-vlr-011.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -51,9 +51,9 @@
<div class="floated-left">lmnor</div>
<div class="floated-left">rstuv</div>
<div class="floated-left">wxyzz</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-contiguous-vrl-010.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-contiguous-vrl-010.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -51,9 +51,9 @@
<div class="floated-left">lmnor</div>
<div class="floated-left">rstuv</div>
<div class="floated-left">wxyzz</div>
</body>
-</html>
\ No newline at end of file
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-htb-in-vlr-002-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-horiz
+ {
+ background-color: blue;
+ color: white;
+ left: 16px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ span
+ {
+ position: relative;
+ top: 40px;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">
+ <div id="orthog-horiz">HTB floated left</div>
+ <span>VLR parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-htb-in-vlr-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated left in vertical-lr context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-lft-orthog-htb-in-vlr-002-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the horizontal position of an orthogonal floated left block box inside a vertical-lr parent. The orthogonal floated left block box must be put as far to the left as possible inside the vertical-lr line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-htb-float-left
+ {
+ background-color: blue;
+ color: white;
+ float: left;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">VLR parent
+ <div id="orthog-htb-float-left">HTB floated left</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-htb-in-vrl-002-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-horiz
+ {
+ background-color: blue;
+ color: white;
+ right: 16px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ span
+ {
+ position: relative;
+ top: 40px;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">
+ <div id="orthog-horiz">HTB floated left</div>
+ <span>VRL parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-htb-in-vrl-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated left in vertical-rl context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-lft-orthog-htb-in-vrl-002-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the horizontal position of an orthogonal floated left block box inside an vertical-rl parent. The orthogonal floated left block box must be put as far to the right as possible inside the vertical-rl line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-htb-float-left
+ {
+ background-color: blue;
+ color: white;
+ float: left;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">VRL parent
+ <div id="orthog-htb-float-left">HTB floated left</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-vlr-in-htb-002-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vert
+ {
+ background-color: blue;
+ color: white;
+ left: 16px;
+ position: absolute;
+ writing-mode: vertical-lr;
+ }
+
+ span
+ {
+ left: 40px;
+ position: relative;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">
+ <div id="orthog-vert">VLR floated left</div>
+ <span>HTB parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-vlr-in-htb-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated left in horizontal-tb context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-lft-orthog-vlr-in-htb-002-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the vertical position of an orthogonal floated left block box inside an horizontal-tb parent. The orthogonal floated left block box must be put as high as possible inside the horizontal-tb line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vlr-float-left
+ {
+ background-color: blue;
+ color: white;
+ float: left;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">HTB parent
+ <div id="orthog-vlr-float-left">VLR floated left</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-vrl-in-htb-002-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2016-12-14T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vert
+ {
+ background-color: blue;
+ color: white;
+ left: 16px;
+ position: absolute;
+ writing-mode: vertical-rl;
+ }
+
+ span
+ {
+ left: 40px;
+ position: relative;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">
+ <div id="orthog-vert">VRL floated left</div>
+ <span>HTB parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-lft-orthog-vrl-in-htb-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated left in horizontal-tb context</title>
+
+ <meta name="DC.date.created" content="2016-11-08T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-lft-orthog-vrl-in-htb-002-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the vertical position of an orthogonal floated left block box inside an horizontal-tb parent. The orthogonal floated left block box must be put as high as possible inside the horizontal-tb line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vrl-float-left
+ {
+ background-color: blue;
+ color: white;
+ float: left;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">HTB parent
+ <div id="orthog-vrl-float-left">VRL floated left</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-horiz
+ {
+ background-color: blue;
+ bottom: 16px;
+ color: white;
+ left: 16px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">
+ <div id="orthog-horiz">HTB floated right</div>
+ <span>VLR parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003.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>
+
+ <title>CSS Writing Modes Test: orthogonal floated right in vertical-lr context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-rgt-orthog-htb-in-vlr-003-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the horizontal position of an orthogonal floated right block box inside a vertical-lr parent. The orthogonal floated right block box must be put as far to the left as possible inside the vertical-lr line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-htb-float-right
+ {
+ background-color: blue;
+ color: white;
+ float: right;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">VLR parent
+ <div id="orthog-htb-float-right">HTB floated right</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-horiz
+ {
+ background-color: blue;
+ bottom: 16px;
+ color: white;
+ position: absolute;
+ right: 16px;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">
+ <div id="orthog-horiz">HTB floated right</div>
+ <span>VRL parent</span>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003.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>
+
+ <title>CSS Writing Modes Test: orthogonal floated right in vertical-rl context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-rgt-orthog-htb-in-vrl-003-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the horizontal position of an orthogonal floated right block box inside a vertical-rl parent. The orthogonal floated right block box must be put as far to the right as possible inside the vertical-rl line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ div#vertical-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-htb-float-right
+ {
+ background-color: blue;
+ color: white;
+ float: right;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="vertical-parent">VRL parent
+ <div id="orthog-htb-float-right">HTB floated right</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vert
+ {
+ background-color: blue;
+ color: white;
+ right: 16px;
+ position: absolute;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">
+ <div id="orthog-vert">VLR floated right</div>
+ HTB parent
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-vlr-in-htb-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated right in horizontal-tb context</title>
+
+ <meta name="DC.date.created" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-rgt-orthog-vlr-in-htb-003-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the vertical position of an orthogonal floated right block box inside an horizontal-tb parent. The orthogonal floated right block box must be put as high as possible inside the horizontal-tb line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vlr-float-right
+ {
+ background-color: blue;
+ color: white;
+ float: right;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">HTB parent
+ <div id="orthog-vlr-float-right">VLR floated right</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <meta name="DC.date.created" content="2016-12-14T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vert
+ {
+ background-color: blue;
+ color: white;
+ right: 16px;
+ position: absolute;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">
+ <div id="orthog-vert">VRL floated right</div>
+ HTB parent
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-rgt-orthog-vrl-in-htb-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>
+
+ <title>CSS Writing Modes Test: orthogonal floated right in horizontal-tb context</title>
+
+ <meta name="DC.date.created" content="2016-11-08T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-17T09:54:03+11:00" scheme="W3CDTF" />
+
+ <!--
+ Inspired by the test in
+ http://lists.w3.org/Archives/Public/www-style/2016Nov/0044.html
+ -->
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://drafts.csswg.org/css-writing-modes-3/#auto-multicol" title="7.3.2 Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="float-rgt-orthog-vrl-in-htb-003-ref.xht" />
+
+ <meta content="" name="flags" />
+ <meta content="This test checks the vertical position of an orthogonal floated right block box inside an horizontal-tb parent. The orthogonal floated right block box must be put as high as possible inside the horizontal-tb line box." name="assert" />
+
+ <style type="text/css"><![CDATA[
+ div#horiz-parent
+ {
+ border: orange solid 8px;
+ font-size: 32px;
+ line-height: 1.25; /* computes to 40px */
+ }
+
+ div#orthog-vrl-float-right
+ {
+ background-color: blue;
+ color: white;
+ float: right;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="horiz-parent">HTB parent
+ <div id="orthog-vrl-float-right">VRL floated right</div>
+ </div>
+
+ </body>
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -50,9 +50,9 @@
<div class="floated-left">
<div class="left-border"></div>
</div>
<div id="reference-overlapped-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -55,9 +55,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-007.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -65,9 +65,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vlr-009.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -55,9 +55,9 @@
<div class="inner-green-border-bottom">R</div>
</div>
<div id="reference-red-overlapped"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -50,9 +50,9 @@
<div class="floated-left">
<div class="left-border"></div>
</div>
<div id="reference-overlapped-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -55,9 +55,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-006.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -65,9 +65,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-008.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -55,9 +55,9 @@
<div class="inner-green-border-bottom">R</div>
</div>
<div id="reference-red-overlapped"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-vlr-016.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-shrink-to-fit-vrl-vlr-016.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -133,9 +133,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-007.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-009.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-011.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-011.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-013.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vlr-013.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-004.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-004.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-006.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-006.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-008.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -42,9 +42,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-010.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-010.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-012.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/float-vrl-012.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -48,9 +48,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/height-width-inline-non-replaced-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/height-width-inline-non-replaced-vlr-003.xht
@@ -5,17 +5,17 @@
<head>
<title>CSS Writing Modes Test: height and width - inline non-replaced element in 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/#vertical-layout" title="7.1 Principles of Layout in Vertical Writing Modes" />
<link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#inline-width" title="10.3.1 Inline, non-replaced elements" />
<link rel="help" href="http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#inline-non-replaced" title="10.6.1 Inline, non-replaced elements" />
- <link rel="match" href="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem" name="flags" />
<meta content="This test checks that height and width declarations do not apply to inline non-replaced elements in vertical writing-modes." name="assert" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -56,9 +56,9 @@
<div id="block">
<div id="inline">A</div>
</div>
<div id="overlapping-green"></div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -66,9 +66,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-009.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-009.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -66,9 +66,9 @@
<div id="wrapper">
<div>
<div id="leftmost"></div>
</div>
<div id="rightmost"></div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-011.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-011.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -67,9 +67,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-015.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-015.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -68,9 +68,9 @@
<div id="wrapper">
<div id="overflow">
<div id="nested"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-017.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-017.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<!--
Test adapted and modified 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.
"
@@ -66,9 +66,9 @@
<div id="wrapper">
<div id="overflow">
<div id="nested"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-025.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-025.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -57,9 +57,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-031.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-031.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -61,9 +61,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-035.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-035.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -64,9 +64,9 @@
<div id="wrapper">
<div id="parent">
<div id="first-child"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-037.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vlr-037.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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" />
@@ -68,9 +68,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-002.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-002.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -66,9 +66,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-008.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-008.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -66,9 +66,9 @@
<div id="wrapper">
<div>
<div id="rightmost"></div>
</div>
<div id="leftmost"></div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-010.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-010.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -67,9 +67,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-014.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-014.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -68,9 +68,9 @@
<div id="wrapper">
<div id="overflow">
<div id="nested"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-016.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-016.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<!--
Test adapted and modified 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.
"
@@ -65,9 +65,9 @@
<div id="wrapper">
<div id="overflow">
<div id="nested"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-024.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-024.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -57,9 +57,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-030.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-030.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -61,9 +61,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-034.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-034.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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.
"
@@ -64,9 +64,9 @@
<div id="wrapper">
<div id="parent">
<div id="first-child"></div>
</div>
</div>
</body>
-</html>
\ No newline at end of file
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-036.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/margin-collapse-vrl-036.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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" />
@@ -68,9 +68,9 @@
<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
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/normal-flow-overconstrained-vlr-003.xht
@@ -0,0 +1,159 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: non-replaced block in normal flow with 'direction: ltr' in vertical-lr (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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" />
+ <link rel="match" href="abs-pos-non-replaced-vlr-007-ref.xht" />
+
+ <meta name="flags" content="ahem image" />
+ <meta name="assert" content="This test checks that when an inline dimension of a non-replaced block in normal flow is over-constrained, the inline-end margin is dropped and recalculated so that the equation involving inline-size is balanced; such equation takes under account the inline's direction (ltr or rtl). In this test, the inline-end margin (physical margin-bottom) is recalculated." />
+
+ <!--
+ "
+ the margin that is dropped when a box’s inline dimension is over-constrained is the end margin as determined by the writing mode of the containing block.
+ "
+ 7.4 Flow-Relative Mappings
+ http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout
+
+ "
+ 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = width of containing block
+
+ If all of the above have a computed value other than 'auto', the values are said to be "over-constrained" and one of the used values will have to be different from its computed value. If the 'direction' property of the containing block has the value 'ltr', the specified value of 'margin-right' is ignored and the value is calculated so as to make the equality true. If the value of 'direction' is 'rtl', this happens to 'margin-left' instead.
+ "
+ CSS 2.1, section 10.3.3 Block-level, non-replaced elements in normal flow
+ http://www.w3.org/TR/CSS21/visudet.html#blockwidth
+ -->
+
+ <meta name="DC.date.created" content="2015-10-16T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-18T09:54:03+11:00" scheme="W3CDTF" />
+
+<style type="text/css"><![CDATA[
+@font-face {
+ font-family: Ahem;
+ src: url("../../../fonts/Ahem.ttf");
+}
+]]></style>
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body#containing-block
+ {
+ background-image: url("support/bg-red-3col-3row-320x320.png");
+ background-position: 198px 8px;
+ /* first value represents the horizontal position and the second represents the vertical position */
+
+ /*
+ 16px (p's margin-left)
+ +
+ 246px (img's width)
+ +
+ 16px (p's margin-right)
+ ========
+ 278px
+ -
+ 80px (1 column of 80px)
+ ========
+ 198px
+ */
+ background-repeat: no-repeat;
+ direction: ltr;
+ height: 320px;
+ margin: 8px;
+ }
+
+ p
+ {
+ margin-left: 16px;
+ margin-right: 16px;
+ }
+
+ div
+ {
+ background-color: green;
+ margin-top: 160px;
+ border-top: green solid 20px;
+ padding-top: 20px;
+ height: 0px;
+ padding-bottom: 20px;
+ border-bottom: green solid 20px;
+ margin-bottom: -160px;
+
+ margin-left: 96px; /* 80px + 16px necessary so that we can reuse an already created and available reference file */
+ width: 80px;
+ }
+
+/*
+"
+Layout calculation rules (such as those in CSS2.1, Section 10.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+"
+7.1 Principles of Layout in Vertical Writing Modes
+http://www.w3.org/TR/css-writing-modes-3/#vertical-layout
+
+So here, *-top and *-bottom properties are input into the §10.3.3 algorithms where *-top properties refer to *-left properties in the layout rules and where *-bottom properties refer to *-right properties in the layout rules.
+
+'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' = height of containing block
+
+So:
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ -160px : margin-bottom
+ ========================
+ 80px : while the height of containing block of div is 320px
+
+So, here, the specified value of 'margin-bottom' is ignored and the value is calculated so as to make the equality true
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ (solve) : margin-bottom
+ ========================
+ 320px : height of containing block
+
+And so computed margin-bottom value must be 80px .
+*/
+
+ ]]></style>
+
+ </head>
+
+ <body id="containing-block">
+
+ <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p>
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/normal-flow-overconstrained-vlr-005.xht
@@ -0,0 +1,160 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: non-replaced block in normal flow with 'direction: rtl' in vertical-lr (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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" />
+ <link rel="match" href="abs-pos-non-replaced-vlr-013-ref.xht" />
+
+ <meta name="flags" content="ahem image" />
+ <meta name="assert" content="This test checks that when an inline dimension of a non-replaced block in normal flow is over-constrained, the inline-end margin is dropped and recalculated so that the equation involving inline-size is balanced; such equation takes under account the inline's direction (ltr or rtl). In this test, the inline-end margin (physical margin-top) is recalculated." />
+
+ <!--
+ "
+ the margin that is dropped when a box’s inline dimension is over-constrained is the end margin as determined by the writing mode of the containing block.
+ "
+ 7.4 Flow-Relative Mappings
+ http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout
+
+ "
+ 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = width of containing block
+
+ If all of the above have a computed value other than 'auto', the values are said to be "over-constrained" and one of the used values will have to be different from its computed value. If the 'direction' property of the containing block has the value 'ltr', the specified value of 'margin-right' is ignored and the value is calculated so as to make the equality true. If the value of 'direction' is 'rtl', this happens to 'margin-left' instead.
+ "
+ CSS 2.1, section 10.3.3 Block-level, non-replaced elements in normal flow
+ http://www.w3.org/TR/CSS21/visudet.html#blockwidth
+ -->
+
+ <meta name="DC.date.created" content="2015-10-16T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-18T09:54:03+11:00" scheme="W3CDTF" />
+
+<style type="text/css"><![CDATA[
+@font-face {
+ font-family: Ahem;
+ src: url("../../../fonts/Ahem.ttf");
+}
+]]></style>
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body#containing-block
+ {
+ background-image: url("support/bg-red-3col-2row-320x320.png");
+ background-position: 198px 8px;
+ /* first value represents the horizontal position and the second represents the vertical position */
+
+ /*
+ 16px (p's margin-left)
+ +
+ 246px (img's width)
+ +
+ 16px (p's margin-right)
+ ========
+ 278px
+ -
+ 80px (1 column of 80px)
+ ========
+ 198px
+ */
+ background-repeat: no-repeat;
+ direction: rtl;
+ height: 320px;
+ margin: 8px;
+ }
+
+ p
+ {
+ direction: ltr;
+ margin-left: 16px;
+ margin-right: 16px;
+ }
+
+ div
+ {
+ background-color: green;
+ margin-top: 160px;
+ border-top: green solid 20px;
+ padding-top: 20px;
+ height: 0px;
+ padding-bottom: 20px;
+ border-bottom: green solid 20px;
+ margin-bottom: 160px;
+
+ margin-left: 96px; /* 80px + 16px necessary so that we can reuse an already created and available reference file */
+ width: 80px;
+ }
+
+/*
+"
+Layout calculation rules (such as those in CSS2.1, Section 10.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+"
+7.1 Principles of Layout in Vertical Writing Modes
+http://www.w3.org/TR/css-writing-modes-3/#vertical-layout
+
+So here, *-top and *-bottom properties are input into the §10.3.3 algorithms where *-top properties refer to *-left properties in the layout rules and where *-bottom properties refer to *-right properties in the layout rules.
+
+'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' = height of containing block
+
+So:
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ 160px : margin-bottom
+ ========================
+ 400px : while the height of containing block of div is 320px
+
+So, here, the specified value of 'margin-top' is ignored and the value is calculated so as to make the equality true
+
+ (solve) : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ 160px : margin-bottom
+ ========================
+ 320px : height of containing block
+
+And so computed margin-top value must be 80px .
+*/
+
+ ]]></style>
+
+ </head>
+
+ <body id="containing-block">
+
+ <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p>
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/normal-flow-overconstrained-vrl-002.xht
@@ -0,0 +1,155 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: non-replaced block in normal flow with 'direction: ltr' in vertical-rl (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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" />
+ <link rel="match" href="abs-pos-non-replaced-vrl-006-ref.xht" />
+
+ <meta name="flags" content="ahem image" />
+ <meta name="assert" content="This test checks that when an inline dimension of a non-replaced block in normal flow is over-constrained, the inline-end margin is dropped and recalculated so that the equation involving inline-size is balanced; such equation takes under account the inline's direction (ltr or rtl). In this test, the inline-end margin (physical margin-bottom) is recalculated." />
+
+ <!--
+ "
+ the margin that is dropped when a box’s inline dimension is over-constrained is the end margin as determined by the writing mode of the containing block.
+ "
+ 7.4 Flow-Relative Mappings
+ http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout
+
+ "
+ 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = width of containing block
+
+ If all of the above have a computed value other than 'auto', the values are said to be "over-constrained" and one of the used values will have to be different from its computed value. If the 'direction' property of the containing block has the value 'ltr', the specified value of 'margin-right' is ignored and the value is calculated so as to make the equality true. If the value of 'direction' is 'rtl', this happens to 'margin-left' instead.
+ "
+ CSS 2.1, section 10.3.3 Block-level, non-replaced elements in normal flow
+ http://www.w3.org/TR/CSS21/visudet.html#blockwidth
+ -->
+
+ <meta name="DC.date.created" content="2015-10-16T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-18T09:54:03+11:00" scheme="W3CDTF" />
+
+<style type="text/css"><![CDATA[
+@font-face {
+ font-family: Ahem;
+ src: url("../../../fonts/Ahem.ttf");
+}
+]]></style>
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body#containing-block
+ {
+ background-image: url("support/bg-red-3col-3row-320x320.png");
+ background-position: -152px 8px;
+ /* first value represents the horizontal position and the second represents the vertical position */
+
+ /*
+ 8px (body's margin-left)
+ -
+ 80px (4th column width)
+ -
+ 80px (3rd column width)
+ ========
+ -152px
+ */
+ background-repeat: no-repeat;
+ direction: ltr;
+ height: 320px;
+ margin: 8px;
+ }
+
+ p
+ {
+ margin-left: 16px;
+ margin-right: 16px;
+ }
+
+ div
+ {
+ background-color: green;
+ margin-top: 160px;
+ border-top: green solid 20px;
+ padding-top: 20px;
+ height: 0px;
+ padding-bottom: 20px;
+ border-bottom: green solid 20px;
+ margin-bottom: -160px;
+
+ margin-right: 96px; /* 80px + 16px necessary so that we can reuse an already created and available reference file */
+ width: 80px;
+ }
+
+/*
+"
+Layout calculation rules (such as those in CSS2.1, Section 10.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+"
+7.1 Principles of Layout in Vertical Writing Modes
+http://www.w3.org/TR/css-writing-modes-3/#vertical-layout
+
+So here, *-top and *-bottom properties are input into the §10.3.3 algorithms where *-top properties refer to *-left properties in the layout rules and where *-bottom properties refer to *-right properties in the layout rules.
+
+'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' = height of containing block
+
+So:
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ -160px : margin-bottom
+ ========================
+ 80px : while the height of containing block of div is 320px
+
+So, here, the specified value of 'margin-bottom' is ignored and the value is calculated so as to make the equality true
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ (solve) : margin-bottom
+ ========================
+ 320px : height of containing block
+
+And so computed margin-bottom value must be 80px .
+*/
+
+ ]]></style>
+
+ </head>
+
+ <body id="containing-block">
+
+ <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p>
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/normal-flow-overconstrained-vrl-004.xht
@@ -0,0 +1,156 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: non-replaced block in normal flow with 'direction: rtl' in vertical-rl (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/#logical-direction-layout" title="7.4 Flow-Relative Mappings" />
+ <link rel="match" href="abs-pos-non-replaced-vrl-012-ref.xht" />
+
+ <meta name="flags" content="ahem image" />
+ <meta name="assert" content="This test checks that when an inline dimension of a non-replaced block in normal flow is over-constrained, the inline-end margin is dropped and recalculated so that the equation involving inline-size is balanced; such equation takes under account the inline's direction (ltr or rtl). In this test, the inline-end margin (physical margin-top) is recalculated." />
+
+ <!--
+ "
+ the margin that is dropped when a box’s inline dimension is over-constrained is the end margin as determined by the writing mode of the containing block.
+ "
+ 7.4 Flow-Relative Mappings
+ http://www.w3.org/TR/css-writing-modes-3/#logical-direction-layout
+
+ "
+ 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = width of containing block
+
+ If all of the above have a computed value other than 'auto', the values are said to be "over-constrained" and one of the used values will have to be different from its computed value. If the 'direction' property of the containing block has the value 'ltr', the specified value of 'margin-right' is ignored and the value is calculated so as to make the equality true. If the value of 'direction' is 'rtl', this happens to 'margin-left' instead.
+ "
+ CSS 2.1, section 10.3.3 Block-level, non-replaced elements in normal flow
+ http://www.w3.org/TR/CSS21/visudet.html#blockwidth
+ -->
+
+ <meta name="DC.date.created" content="2015-10-16T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-18T09:54:03+11:00" scheme="W3CDTF" />
+
+<style type="text/css"><![CDATA[
+@font-face {
+ font-family: Ahem;
+ src: url("../../../fonts/Ahem.ttf");
+}
+]]></style>
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body#containing-block
+ {
+ background-image: url("support/bg-red-3col-2row-320x320.png");
+ background-position: -152px 8px;
+ /* first value represents the horizontal position and the second represents the vertical position */
+
+ /*
+ 8px (body's margin-left)
+ -
+ 80px (4th column width)
+ -
+ 80px (3rd column width)
+ ========
+ -152px
+ */
+ background-repeat: no-repeat;
+ direction: rtl;
+ height: 320px;
+ margin: 8px;
+ }
+
+ p
+ {
+ direction: ltr;
+ margin-left: 16px;
+ margin-right: 16px;
+ }
+
+ div
+ {
+ background-color: green;
+ margin-top: 160px;
+ border-top: green solid 20px;
+ padding-top: 20px;
+ height: 0px;
+ padding-bottom: 20px;
+ border-bottom: green solid 20px;
+ margin-bottom: 160px;
+
+ margin-right: 96px; /* 80px + 16px necessary so that we can reuse an already created and available reference file */
+ width: 80px;
+ }
+
+/*
+"
+Layout calculation rules (such as those in CSS2.1, Section 10.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+"
+7.1 Principles of Layout in Vertical Writing Modes
+http://www.w3.org/TR/css-writing-modes-3/#vertical-layout
+
+So here, *-top and *-bottom properties are input into the §10.3.3 algorithms where *-top properties refer to *-left properties in the layout rules and where *-bottom properties refer to *-right properties in the layout rules.
+
+'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' = height of containing block
+
+So:
+
+ 160px : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ 160px : margin-bottom
+ ========================
+ 400px : while the height of containing block of div is 320px
+
+So, here, the specified value of 'margin-top' is ignored and the value is calculated so as to make the equality true
+
+ (solve) : margin-top
+ +
+ 20px : border-top-width
+ +
+ 20px : padding-top
+ +
+ 0px : height
+ +
+ 20px : padding-bottom
+ +
+ 20px : border-bottom-width
+ +
+ 160px : margin-bottom
+ ========================
+ 320px : height of containing block
+
+And so computed margin-top value must be 80px .
+*/
+
+ ]]></style>
+
+ </head>
+
+ <body id="containing-block">
+
+ <p><img src="support/pass-cdts-abs-pos-non-replaced.png" width="246" height="36" alt="Image download support must be enabled" /></p>
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ p
+ {
+ margin: 8px;
+ }
+
+ img
+ {
+ vertical-align: top;
+ }
+
+ img + img
+ {
+ margin-left: 96px;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-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>
+
+ <title>CSS Writing Modes Test: over-constrained relatively positioned element - 'direction: ltr' and 'left' and 'right' are not 'auto' in vertical-lr context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-ltr-left-right-vlr-005-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'ltr' and its 'left' and 'right' are not 'auto' in a vertical-lr context, then the value of 'left' wins and 'right' becomes -'left'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-upp-left-corn-320x320.png") no-repeat 358px 8px;
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ 80px : since we would need a bg-red which would be in 1st row and 2nd column
+ (and not 1st column)
+ ========
+ 358px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 1st row in bg-red-upp-left-corn-320x320 */
+
+ direction: ltr;
+ writing-mode: vertical-lr;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, left and right offset properties are input into the §9.4.3 algorithms where left offset property refer to top offset property in the layout rules and where right offset property refer to bottom offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ left: 80px;
+ height: 80px;
+ position: relative;
+ right: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'left' should win, 'right' should be ignored and the used right value should become -'left'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ direction: rtl;
+ }
+
+ p
+ {
+ margin: 8px;
+ }
+
+ img
+ {
+ vertical-align: top;
+ }
+
+ img + img
+ {
+ margin-right: 96px;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004.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: over-constrained relatively positioned element - 'direction: ltr' and 'left' and 'right' are not 'auto' in vertical-rl context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-ltr-left-right-vrl-004-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'ltr' and its 'left' and 'right' are not 'auto' in a vertical-rl context, then the value of 'right' wins and 'left' becomes -'right'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-upp-rght-corn-320x320.png") no-repeat calc(100% - 358px) 8px;
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ 80px : since we would need a bg-red which would be in 1st row
+ and in 3rd column (not in 4th column)
+ ========
+ 358px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 1st row in bg-red-upp-rght-corn-320x320 */
+
+ direction: ltr;
+ writing-mode: vertical-rl;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, left and right offset properties are input into the §9.4.3 algorithms where left offset property refer to top offset property in the layout rules and where right offset property refer to bottom offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ left: 80px;
+ height: 80px;
+ position: relative;
+ right: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'right' should win, 'left' should be ignored and the used left value should become -'right'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-22T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ p
+ {
+ left: 16px;
+ position: absolute;
+ top: -8px;
+ }
+
+ img
+ {
+ vertical-align: top;
+ }
+
+ img + img
+ {
+ left: 16px;
+ 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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003.xht
@@ -0,0 +1,81 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: over-constrained relatively positioned element - 'direction: ltr' and 'top' and 'bottom' are not 'auto' in vertical-lr context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+
+ <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="overconstrained-rel-pos-ltr-top-bottom-vlr-003-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'ltr' and its 'top' and 'bottom' are not 'auto' in a vertical-lr context, then the value of 'top' wins and 'bottom' becomes -'top'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-1col-2row-320x320.png") no-repeat 278px 8px;
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ ========
+ 278px : background-position from the left edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 2nd row in bg-red-1col-2row-320x320 */
+
+ direction: ltr;
+ writing-mode: vertical-lr;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, top and bottom offset properties are input into the §9.4.3 algorithms where top offset property refer to left offset property in the layout rules and where bottom offset property refer to right offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ bottom: 80px;
+ height: 80px;
+ position: relative;
+ top: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'top' should win, 'bottom' should be ignored and the used bottom value should become -'top'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-22T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ direction: rtl;
+ }
+
+ p
+ {
+ position: absolute;
+ right: 16px;
+ top: -8px;
+ }
+
+ img
+ {
+ vertical-align: top;
+ }
+
+ img + img
+ {
+ position: relative;
+ right: 16px;
+ 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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002.xht
@@ -0,0 +1,81 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: over-constrained relatively positioned element - 'direction: ltr' and 'top' and 'bottom' are not 'auto' in vertical-rl context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+
+ <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="overconstrained-rel-pos-ltr-top-bottom-vrl-002-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'ltr' and its 'top' and 'bottom' are not 'auto' in a vertical-rl context, then the value of 'top' wins and 'bottom' becomes -'top'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-4col-2row-320x320.png") no-repeat calc(100% - 278px) 8px;
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ ========
+ 278px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 2nd row in bg-red-4col-2row-320x320 */
+
+ direction: ltr;
+ writing-mode: vertical-rl;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, top and bottom offset properties are input into the §9.4.3 algorithms where top offset property refer to left offset property in the layout rules and where bottom offset property refer to right offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ bottom: 80px;
+ height: 80px;
+ position: relative;
+ top: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'top' should win, 'bottom' should be ignored and the used bottom value should become -'top'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-22T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ p
+ {
+ bottom: -8px;
+ left: 16px;
+ position: absolute;
+ }
+
+ img
+ {
+ vertical-align: bottom;
+ }
+
+ img + img
+ {
+ left: 96px;
+ position: relative;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009.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: over-constrained relatively positioned element - 'direction: rtl' and 'left' and 'right' are not 'auto' in vertical-lr context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-rtl-left-right-vlr-009-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'rtl' and its 'left' and 'right' are not 'auto' in a vertical-lr context, then the value of 'right' wins and 'left' becomes -'right'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-low-left-corn-320x320.png") no-repeat 358px calc(100% - 8px);
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ 80px : since we would need a bg-red which would be in 4th row
+ and 2nd column (and not in 1st column)
+ ========
+ 358px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 4th row in bg-red-low-left-corn-320x320.png */
+
+ direction: rtl;
+ writing-mode: vertical-lr;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, left and right offset properties are input into the §9.4.3 algorithms where left offset property refer to top offset property in the layout rules and where right offset property refer to bottom offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ left: 80px;
+ height: 80px;
+ position: relative;
+ right: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'left' should win, 'right' should be ignored and the used right value should become -'left'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008-ref.xht
@@ -0,0 +1,54 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-22T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ direction: rtl;
+ }
+
+ p
+ {
+ bottom: -8px;
+ position: absolute;
+ right: 16px;
+ }
+
+ img
+ {
+ vertical-align: bottom;
+ }
+
+ img + img
+ {
+ position: relative;
+ right: 96px;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008.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: over-constrained relatively positioned element - 'direction: rtl' and 'left' and 'right' are not 'auto' in vertical-rl context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-rtl-left-right-vrl-008-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'rtl' and its 'left' and 'right' are not 'auto' in a vertical-rl context, then the value of 'right' wins and 'left' becomes -'right'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-low-rght-corn-320x320.png") no-repeat calc(100% - 358px) calc(100% - 8px);
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ 80px : since we would need a bg-red which would be in 4th row
+ and 3rd col (and not 4th col)
+ ========
+ 358px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 1st row in bg-red-low-rght-corn-320x320 */
+
+ direction: rtl;
+ writing-mode: vertical-rl;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, left and right offset properties are input into the §9.4.3 algorithms where left offset property refer to top offset property in the layout rules and where right offset property refer to bottom offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ left: 80px;
+ height: 80px;
+ position: relative;
+ right: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'right' should win, 'left' should be ignored and the used left value should become -'right'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-22T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ p
+ {
+ bottom: -8px;
+ left: 16px;
+ position: absolute;
+ }
+
+ img
+ {
+ vertical-align: bottom;
+ }
+
+ img + img
+ {
+ bottom: 80px;
+ left: 16px;
+ position: relative;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007.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>
+
+ <title>CSS Writing Modes Test: over-constrained relatively positioned element - 'direction: rtl' and 'top' and 'bottom' are not 'auto' in vertical-lr context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-rtl-top-bottom-vlr-007-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'rtl' and its 'top' and 'bottom' are not 'auto' in a vertical-lr context, then the value of 'top' wins and 'bottom' becomes -'top'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-1col-3row-320x320.png") no-repeat 278px calc(100% - 8px);
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ ========
+ 278px : background-position from the left edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 3rd row in bg-red-1col-3row-320x320 */
+
+ direction: rtl;
+ writing-mode: vertical-lr;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, top and bottom offset properties are input into the §9.4.3 algorithms where top offset property refer to left offset property in the layout rules and where bottom offset property refer to right offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ bottom: 80px;
+ height: 80px;
+ position: relative;
+ top: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'bottom' should win, 'top' should be ignored and the used top value should become -'bottom'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta content="image" name="flags" />
+
+ <meta name="DC.date.created" content="2017-02-25T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-03-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ direction: rtl;
+ }
+
+ p
+ {
+ bottom: -8px;
+ position: absolute;
+ right: 16px;
+ }
+
+ img
+ {
+ vertical-align: bottom;
+ }
+
+ img + img
+ {
+ bottom: 80px;
+ position: relative;
+ right: 16px;
+ }
+ ]]></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" /><img src="support/swatch-green.png" width="80" height="80" alt="Image download support must be enabled" /></p>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006.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>
+
+ <title>CSS Writing Modes Test: over-constrained relatively positioned element - 'direction: rtl' and 'top' and 'bottom' are not 'auto' in vertical-rl context</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <!--
+ Credits should go to Aleks Totić for reporting
+ Issue 695270: overconstrained position:relative in vertical-xx is not in compliance with spec
+ https://bugs.chromium.org/p/chromium/issues/detail?id=695270
+ and for providing an excellent test originally demonstrating the particular feature
+ being checked in this test.
+ -->
+ <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="overconstrained-rel-pos-rtl-top-bottom-vrl-006-ref.xht" />
+
+ <meta name="flags" content="image" />
+ <meta name="assert" content="When a relatively positioned element's 'direction' is 'rtl' and its 'top' and 'bottom' are not 'auto' in a vertical-rl context, then the value of 'top' wins and 'bottom' becomes -'top'." />
+
+ <meta name="DC.date.created" content="2017-02-23T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-02-28T09:54:03+11:00" scheme="W3CDTF" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ background: transparent url("support/bg-red-4col-3row-320x320.png") no-repeat calc(100% - 278px) calc(100% - 8px);
+ /*
+ 16px : p's margin-right
+ 246px : img's width
+ 16px : p's margin-left
+ ========
+ 278px : background-position from the right edge of document box
+ */
+
+ /* top = 8px since the red fail square is already on 3rd row in bg-red-4col-3row-320x320 */
+
+ direction: rtl;
+ writing-mode: vertical-rl;
+ }
+
+/*
+Layout calculation rules (such as those in CSS2.1, Section 9.4.3) that apply to the horizontal dimension in horizontal writing modes instead apply to the vertical dimension in vertical writing modes.
+
+So here, top and bottom offset properties are input into the §9.4.3 algorithms where top offset property refer to left offset property in the layout rules and where bottom offset property refer to right offset property in the layout rules.
+*/
+
+ div
+ {
+ background-color: green;
+ bottom: 80px;
+ height: 80px;
+ position: relative;
+ top: 80px;
+ width: 80px;
+ }
+
+ /*
+ Here, 'bottom' should win, 'top' should be ignored and the used top value should become -'bottom'.
+ */
+ ]]></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>
+
+ <!--
+ The image says:
+ Test passes if there is a filled
+ green square and <strong>no red</strong>.
+ -->
+
+ <div></div>
+
+ </body>
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/reference/text-combine-upright-value-single-character.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/reference/text-combine-upright-value-single-character.html
@@ -1,15 +1,14 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Writing Modes: text-combine-upright: all</title>
<link rel="author" title="Masataka Yakura" href="https://google.com/+MasatakaYakura">
-<meta name="flags" content="font">
<style>
@font-face {
font-family: tcu-font;
src: url("support/tcu-font.woff");
}
.test {
writing-mode: vertical-rl;
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ width: calc(136px + 100vw + 136px);
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ padding: 0px 84px;
+ width: calc(136px + 100% + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-003-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: 0px;
+ padding: 0px 84px;
+ position: absolute;
+ width: calc(136px + 3px + 15ch + 3px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ width: 15ch;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">123456789012345</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-003.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-004-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ width: calc(100px + 100vw + 100px);
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ margin: 0px 100px;
+ width: 100vw;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-004.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-006-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ margin-left: 92px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-006.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: 0px;
+ padding: 0px 84px;
+ position: absolute;
+ width: 672px;
+ /*
+ 136px :
+ +
+ 400px :
+ +
+ 136px :
+ ===========
+ 672px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-007.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-008-ref.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: 0px;
+ padding: 0px 84px;
+ position: absolute;
+ width: calc(136px + 3px + 50ch + 3px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01020304050607080910111213141516171819202122232425</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-008.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, min-content inline size (50ch) is greater than the width (400px) of the containing block. Therefore, the inline size of the orthogonal block will be the min-content inline size." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-009.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-010-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ margin-left: 92px;
+ width: 394px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-010.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-010-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-011-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ margin-left: 92px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-011.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-011-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, we assume that the 50 characters long word is wider than the div#sized-400px-vlr-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-012.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-013-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ width: calc(52px + 100vw + 52px);
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: calc(52px + 100% + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-013.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-013-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-015-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: calc(52px + 3px + 15ch + 3px + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ width: 15ch;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">123456789012345</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-015.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-016-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ box-sizing: border-box;
+ width: 100vw;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-016.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-016-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-018-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-018.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-019-ref.xht
@@ -0,0 +1,81 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: 504px;
+ /*
+ 52px :
+ +
+ 400px :
+ +
+ 52px :
+ ============
+ 504px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-019.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-019-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-020-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: calc(52px + 3px + 50ch + 3px + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01020304050607080910111213141516171819202122232425</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-020.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-020-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width (inline-size) of the containing block is definite in this test, then the constrain is the width (inline-size) of such containing block which is, in this test, 400px. But the min-content inline size of the orthogonal block is greater than the width (inline-size) of the containing block. Therefore, the min-content inline-size will become the width of the orthogonal block." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-021.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-022-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ width: 394px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-022.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-022-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then the constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-023-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: left;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-023.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-023-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, we assume that the 50 characters long word is wider than the div#sized-400px-vlr-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vlr-024.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vlr tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' its max-content inline-size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ width: calc(136px + 100vw + 136px);
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ padding: 0px 84px;
+ position: absolute;
+ width: calc(136px + 100% + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-13T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ size (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 136px - 3px - 15ch - 3px - 136px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ padding: 0px 84px;
+ position: absolute;
+ width: calc(136px + 3px + 15ch + 3px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ width: 15ch;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">123456789012345</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-003.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-004.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-006-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ margin-right: 92px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-006.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content will be less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-007-ref.xht
@@ -0,0 +1,84 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 136px - 400px - 136px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ padding: 0px 84px;
+ position: absolute;
+ width: 672px;
+ /*
+ 136px :
+ +
+ 400px :
+ +
+ 136px :
+ ===========
+ 672px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-007.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-008-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 136px - 3px - 50ch - 3px - 136px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ padding: 0px 84px;
+ position: absolute;
+ width: calc(136px + 3px + 50ch + 3px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01020304050607080910111213141516171819202122232425</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-008.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, min-content inline size (50ch) is greater than the width (400px) of the containing block. Therefore, the inline size of the orthogonal block will be the min-content inline size." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-009.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. In this test, the max-content inline size of the orthogonal block will be smaller than the width of its containing block. Therefore the inline size of div#ortho-block-htb will be its max-content inline-size." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-010-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ margin-right: 92px;
+ width: 394px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-010.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-010-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. Therefore, the outer edges of the inline-axis of the orthogonal block becomes '400px'." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-011-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ margin-right: 92px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-011.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-011-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. But the min-content inline size of the orthogonal block is greater than '400px' and less than the width of the initial containing block. In such case, the inline-size content edges of the orthogonal block becomes its min-content. In this test, we assume that the 50 characters long word is wider than the div#sized-400px-vrl-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-012.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. The max-content is narrower than the definite-sized width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-013-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ width: calc(52px + 100vw + 52px);
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: calc(52px + 100% + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-013.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-013-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-015-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 52px - 3px - 15ch - 3px - 52px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ position: absolute;
+ width: calc(52px + 3px + 15ch + 3px + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ width: 15ch;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">123456789012345</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-015.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-015-ref.xht" />
+
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. But the max-content inline size of the orthogonal block is less than the width of the initial containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-016.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vlr-016-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-018-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-right: 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-018.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the width of the containing block is indefinite in this test, then constrain is the width of initial containing block which is, in this test, equal to the width of the viewport. In this test, the max-content inline size of the orthogonal block is less than the width of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-019-ref.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 52px - 400px - 52px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ position: absolute;
+ width: 504px; /* 52px + 400px + 52px == 504px */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-019.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-019-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-020-ref.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 52px - 3px - 50ch - 3px - 52px);
+ /* or more elegantly right: 0px; Chrome 57+ has a bug here */
+ position: absolute;
+ width: calc(52px + 3px + 50ch + 3px + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01020304050607080910111213141516171819202122232425</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-020.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-020-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. min-content inline size is greater than 400px. Therefore, the inline size of the orthogonal block will be its min-content. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-021.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-022-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ width: 394px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-022.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-022-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-023-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-30T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ float: right;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-023.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-023-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, we assume that the 50 characters long word is wider than the div#sized-400px-vrl-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-htb-in-vrl-024.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with 'auto' inline size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-htb-in-vrl-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the width of the containing block is definite in this test, then constrain is the width of such containing block which is, in this test, 400px. This test presumes that the initial containing block's width is greater than 400px. In this test, the max-content will be less than the width of the containing block. Therefore the inline size of div#ortho-block-htb will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-htb-in-vrl tests:
+ 001-012 : body has 100px margin-left and 100px margin-right
+ 013-024 : body has no horizontal margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's width is 'auto' therefore indefinite
+ 007-012: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's width is 'auto'
+ 002: orthogonal block's width is 'auto' and its min-content
+ inline size (1 very long word) is wider than constraint
+ 003: orthogonal block's width is 'auto' and its max-content inline size
+ is narrower than max(min-content, constraint)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: auto;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ padding: 0px 84px;
+ width: calc(136px + 35px + 50vw + 35px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 35px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001.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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ margin-left: 92px;
+ width: 50vw;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-002-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ padding: 0px 84px;
+ width: calc(136px + 3px + 200px + 3px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ margin: 0px 92px;
+ width: 200px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004.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 Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005-ref.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ width: calc(52px + 35px + 50vw + 35px + 52px);
+ /*
+ 52px : offsetWidth of sentence-before
+ 35px : left border
+ 50vw : content width of tested orthogonal block
+ 35px : right border
+ 52px : offsetWidth of sentence-after
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 35px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-005-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ width: 50vw;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vlr-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007-ref.xht
@@ -0,0 +1,84 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ width: 310px;
+ /*
+ 52px :
+ +
+ 3px :
+ +
+ 200px :
+ +
+ 3px :
+ +
+ 52px :
+ ============
+ 310px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-lr;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ width: 200px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008.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 Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-lr' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vlr-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vlr tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vlr-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vlr-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001-ref.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ padding: 0px 84px;
+ left: calc(50% - 136px - 35px - 35px - 136px);
+ width: calc(136px + 35px + 50vw + 35px + 136px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 35px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ position: absolute;
+ right: 100px;
+ width: 50vw;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-002-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-04T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 478px);
+ padding: 0px 84px;
+ position: absolute;
+ width: 478px;
+ /*
+ 136px :
+ +
+ 3px :
+ +
+ 200px :
+ +
+ 3px :
+ +
+ 136px :
+ ==========
+ 478px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-19T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-27T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ position: absolute;
+ right: 100px;
+ width: 200px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004.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 Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 100px;
+ margin-right: 100px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ position: absolute;
+ right: 0px;
+ width: calc(52px + 35px + 50vw + 35px + 52px);
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 35px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-005-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 35px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ right: 0px;
+ position: absolute;
+ width: 50%;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside auto-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the width of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the width of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#auto-sized-vrl-containing-block
+ {
+ width: auto;
+ /*
+ 'width: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin: 8px 0px;
+ }
+
+ table
+ {
+ border-spacing: 0px;
+ left: calc(100% - 310px);
+ position: absolute;
+ width: 310px;
+ /*
+ 52px :
+ +
+ 3px :
+ +
+ 200px :
+ +
+ 3px :
+ +
+ 52px :
+ ===========
+ 310px
+ */
+ }
+
+ td
+ {
+ padding: 0px;
+ vertical-align: top;
+ }
+
+ td#after, td#before
+ {
+ width: 52px;
+ }
+
+ p#sentence-after, p#sentence-before
+ {
+ writing-mode: vertical-rl;
+ }
+
+ td#data
+ {
+ border: blue solid 3px;
+ display: block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <table>
+
+ <tr>
+
+ <td id="after"><p id="sentence-after">Sentence after.</p></td>
+
+ <td id="data">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</td>
+
+ <td id="before"><p id="sentence-before">Sentence before.</p></td>
+
+ </tr>
+
+ </table>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ position: absolute;
+ right: 0px;
+ width: 200px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008.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 Writing Modes Test: sizing of orthogonal 'horizontal-tb' block with percent inline-size inside definite-sized 'vertical-rl' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-htb-in-vrl-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the width of the containing block is definite, therefore 50% is applied on the width of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-htb-in-vrl tests:
+ 001-004: body has 100px margin-left and 100px margin-right
+ 005-008: body has no horizontal margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's width is 'auto' therefore indefinite
+ 003-004: containing block's width is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-left: 0px;
+ margin-right: 0px;
+ }
+
+ div#sized-400px-vrl-containing-block
+ {
+ width: 400px;
+ }
+
+ div#ortho-block-htb
+ {
+ border: blue solid 3px;
+ width: 50%;
+ writing-mode: horizontal-tb;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-vrl-containing-block">
+
+ <div id="ortho-block-htb">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ width: auto;
+ }
+
+ p#sentence-after
+ {
+ top: calc(100px - 16px + 52px + 35px + 50vh + 35px);
+ /*
+ 50vh means 50 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 50vh == half of the height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ padding-bottom: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 35px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002.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 Writing Modes Test: sizing of orthogonal 'vertical-lr' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-002-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 222px; /* 600px - 342px - 36px == 222px */
+ top: 342px; /* 100px - 16px + 52px + 3px + 200px + 3px == 342px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003.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 Writing Modes Test: sizing of orthogonal 'vertical-lr' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(52px + 35px + 50vh + 35px);
+ /*
+ 50vh means 50 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 50vh == half of the height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-005-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 35px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 122px;
+ top: 258px; /* 52px + 3px + 200px + 3px == 258px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vlr-in-htb-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vlr-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(100px - 16px + 52px + 35px + 50vh + 35px);
+ /*
+ 50vh means 50 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 50vh == half of the height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ padding-bottom: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001.xht
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 35px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-002-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 222px; /* 600px - 342px - 36px == 222px */
+ top: 342px; /* 100px - 16px + 52px + 3px + 200px + 3px == 342px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003.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 Writing Modes Test: sizing of orthogonal 'vertical-rl' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(52px + 35px + 50vh + 35px);
+ /*
+ 50vh means 50 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 50vh == half of the height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-005-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 35px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 50%;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with percent inline-size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is '50%' and its containing block's block size is 'auto'. Since the height of the containing block is indefinite in this test, then the initial containing block's size is used as a fallback which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 122px;
+ top: 258px; /* 52px + 3px + 200px + 3px == 258px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007.xht
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-22T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 200px;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with percent inline-size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-auto" title="7.3.1 Available Sizes in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-prct-vrl-in-htb-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the height of the containing block is definite, therefore 50% is applied on the height of such containing block which is, in this test, 400px." />
+
+ <!--
+
+ Inside this batch of 8 sizing-orthog-prct-vrl-in-htb tests:
+ 001-004: body has 100px margin-bottom and 100px margin-top
+ 005-008: body has no vertical margins
+
+ Inside each sub-batch of 4 tests:
+ 001-002: containing block's height is 'auto' therefore indefinite
+ 003-004: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 2 tests:
+ 001: containing block has 1 sentence before and after
+ 002: containing block has no sentence before and no sentence after
+
+ 001 and 005 tests use a 35px thick border.
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: 50%;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 100px;
+ top: calc(100px - 16px + 52px + 100vh);
+ /*
+ 100vh means 100 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 100vh == height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-001.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-003-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(136px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ padding-bottom: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-003.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-004.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-006-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-006.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 400px;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 28px; /* 600px - 536px -52px + 16px == 28px */
+ top: 536px; /* 100px - 16px + 52px + 400px == 536px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-007.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-008-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2016-12-29T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ left: 8px;
+ padding-bottom: 16px;
+ position: absolute;
+ top: calc(136px + 3px + 50ch + 3px);
+ /*
+ 50ch means 50 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-008.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, min-content inline size is presumed to be greater than the height (400px) of the containing block. Therefore the content edges of the inline size of the orthogonal block will be its min-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-009-ref.xht
@@ -0,0 +1,97 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: calc(600px - 100px + 16px - 52px - 3px - 15ch - 3px - 52px + 16px);
+ /*
+ 600px
+ -
+ 100px
+ +
+ 16px : margin collapsing of p#sentence-before's margin-top with body's margin-top
+ -
+ 52px
+ -
+ 3px
+ -
+ 15ch
+ -
+ 3px
+ -
+ 52px
+ +
+ 16px : margin collapsing of p#sentence-after's margin-bottom with body's margin-bottom
+ ============
+ approx. 270px
+ */
+
+ top: calc(136px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-009.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-009-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-010-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 394px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-010.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-010-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-011-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-011.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-011-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, we assume that the 50 characters long word is greater than the height of div#sized-400px-htb-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012 : body has 100px margin-top and 100px margin-bottom
+ 013-024 : body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-012-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 92px 0px;
+ height: 416px;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ display: inline-block;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-012.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-012-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-013-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 1em;
+ top: calc(52px + 100vh);
+ /*
+ 100vh means 100 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 100vh == height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-013.xht
@@ -0,0 +1,103 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-013-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-015-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(52px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-015.xht
@@ -0,0 +1,103 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-016-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-016.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-016-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 35px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-018-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-018.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-019-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 394px;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ top: 452px; /* 52px + 400px == 452px */
+ padding-bottom: 1em;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-019.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-019-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-020-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ left: 8px;
+ padding-bottom: 1em;
+ position: absolute;
+ top: calc(52px + 3px + 50ch + 3px);
+ /*
+ 50ch means 50 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-020.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-020-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, min-content will be greater than the height of the containing block. Therefore, the inline size of the orthogonal block will be its min-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-021.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content of the orthogonal block will be less than the height of its definite containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-022-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 394px;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-022.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-022-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-023-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-lr;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-023.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-023-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, we assume that the 50 characters long word is greater than the height of div#sized-400px-htb-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vlr-in-htb-024.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-lr' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vlr-in-htb-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vlr-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' its max-content inline-size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vlr
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-lr;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vlr">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-001-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 100px;
+ top: calc(100px - 16px + 52px + 100vh);
+ /*
+ 100vh means 100 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 100vh == height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-001.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-001-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-02T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-003-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 100px;
+ top: calc(136px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-003.xht
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-003-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-08T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-004-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-004.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-004-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-006-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-006.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-006-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-007-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 400px;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 28px; /* 600px - 536px -52px + 16px == 28px */
+ top: 536px; /* 100px - 16px + 52px + 400px == 536px */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-007.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-007-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-008-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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 1em;
+ top: calc(136px + 3px + 50ch + 3px);
+ /*
+ 50ch means 50 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-008.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-008-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, min-content inline size is presumed to be greater than the height (400px) of the containing block. Therefore the content edges of the inline size of the orthogonal block will be its min-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-009-ref.xht
@@ -0,0 +1,97 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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 rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 0px;
+ top: 100px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 136px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: calc(600px - 100px + 16px - 52px - 3px - 15ch - 3px - 52px + 16px);
+ /*
+ 600px
+ -
+ 100px
+ +
+ 16px : margin collapsing of p#sentence-before's margin-top with body's margin-top
+ -
+ 52px
+ -
+ 3px
+ -
+ 15ch
+ -
+ 3px
+ -
+ 52px
+ +
+ 16px : margin collapsing of p#sentence-after's margin-bottom with body's margin-bottom
+ ============
+ approx. 270px
+ */
+
+ top: calc(136px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-009.xht
@@ -0,0 +1,100 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-009-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-010-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 400px;
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 400px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-010.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-010-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-011-ref.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 xmlns="http://www.w3.org/1999/xhtml">
+
+ <head>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ padding: 100px 0px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-011.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-011-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, we assume that the 50 characters long word is greater than the height of div#sized-400px-htb-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ /* Nota bene: margin-top of p#sentence-before will collapse with body's margin-top */
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-012-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-10-04T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 600px;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ left: 8px;
+ position: absolute;
+ top: 100px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-012.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-012-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-15T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-08T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 100px;
+ margin-top: 100px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-013-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ height: 100%;
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ height: 100%;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 1em;
+ top: calc(52px + 100vh);
+ /*
+ 100vh means 100 vh unit where each vh is equal to
+ 1% of the height of the initial containing block.
+ So 100vh == height of initial containing block
+ 5.1.2. Viewport-percentage lengths: the vw, vh, vmin, vmax units
+ https://www.w3.org/TR/css3-values/#vh
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-013.xht
@@ -0,0 +1,103 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-013-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-015-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ top: calc(52px + 3px + 15ch + 3px);
+ /*
+ 15ch means 15 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-015.xht
@@ -0,0 +1,103 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD 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: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-016-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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div
+ {
+ border: blue solid 35px;
+ box-sizing: border-box;
+ height: 100%;
+ left: 8px;
+ position: absolute;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-016.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-016-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 35px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-018-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>123456789012345</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-018.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside auto-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is also 'auto'. Since the height of the containing block is indefinite in this test, then constrain is the height of initial containing block which is, in this test, equal to the height of the viewport. In this test, the max-content will be smaller than the height of the initial containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#auto-sized-htb-containing-block
+ {
+ height: auto;
+ /*
+ 'height: auto' causes the measurement of the orthogonal
+ box's containing block to be indefinite
+ */
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="auto-sized-htb-containing-block">
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-019-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 394px;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 1em;
+ top: 452px;
+ /*
+ 52px :
+ +
+ 3px :
+ +
+ 394px :
+ +
+ 3px :
+ ============
+ 452px
+ */
+ }
+
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-019.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-019-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-020-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ p
+ {
+ left: 8px;
+ position: absolute;
+ writing-mode: horizontal-tb;
+ }
+
+ p#sentence-before
+ {
+ margin-top: 8px;
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 52px;
+ }
+
+ p#sentence-after
+ {
+ padding-bottom: 1em;
+ top: calc(52px + 3px + 50ch + 3px);
+ /*
+ 50ch means 50 ch unit where each ch is equal to
+ the used advance measure of the "0" (ZERO, U+0030) glyph found
+ in the font used to render it.
+ 5.1.1. Font-relative lengths: the em, ex, ch, rem units
+ https://www.w3.org/TR/css3-values/#ch
+ */
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-020.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-020-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-285T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, min-content will be greater than the height of the containing block. Therefore, the inline size of the orthogonal block will be its min-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">01020304050607080910111213141516171819202122232425</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-021.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-015-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content of the orthogonal block will be less than the height of its definite containing block. Therefore the inline size of div#ortho-block-vlr will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <p id="sentence-before">Sentence before.</p>
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ <p id="sentence-after">Sentence after.</p>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-022-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: 394px;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-022.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-022-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 00</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-023-ref.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>
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+
+ <meta name="DC.date.created" content="2016-12-20T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta content="" name="flags" />
+
+ <style type="text/css"><![CDATA[
+ html
+ {
+ writing-mode: vertical-rl;
+ }
+
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ }
+
+ div
+ {
+ border: blue solid 3px;
+ height: auto;
+ left: 8px;
+ position: absolute;
+ top: 0px;
+ }
+ ]]></style>
+ </head>
+
+ <body>
+
+ <div>01020304050607080910111213141516171819202122232425</div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-023.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-023-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, we assume that the 50 characters long word is greater than the height of div#sized-400px-htb-containing-block. Therefore, min-content is greater than constraint." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">01020304050607080910111213141516171819202122232425</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/sizing-orthog-vrl-in-htb-024.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>
+
+ <title>CSS Writing Modes Test: sizing of orthogonal 'vertical-rl' block with 'auto' inline size inside definite-sized 'horizontal-tb' containing block</title>
+
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#auto-multicol" title="7.3.2. Auto-sizing Block Containers in Orthogonal Flows" />
+ <link rel="match" href="sizing-orthog-vrl-in-htb-018-ref.xht" />
+
+ <meta name="DC.date.created" content="2016-09-28T09:54:03+11:00" scheme="W3CDTF" />
+ <meta name="DC.date.modified" content="2017-01-03T09:54:03+11:00" scheme="W3CDTF" />
+
+ <meta name="flags" content="" />
+ <meta name="assert" content="In this test, the inline size of the orthogonal block is 'auto' and its containing block's block size is '400px'. Since the height of the containing block is definite in this test, then constrain is the height of such containing block which is, in this test, 400px. This test presumes that the initial containing block's height is greater than 400px. In this test, the max-content will be smaller than the height of the containing block. Therefore the inline size of div#ortho-block-vrl will be its max-content." />
+
+ <!--
+
+ shrink-to-fit formula is: min(max-content, max(min-content, constraint))
+
+ max-content inline size: narrowest inline size needed to fit its contents
+ if none of the soft wrap opportunities within the box were taken. Eg:
+ max-content of "I am a text sentence." is "I am a text sentence."
+ https://www.w3.org/TR/css-sizing-3/#max-content-inline-size
+
+ min-content inline size of the box: longest word in a sentence or longest non-breakable
+ inline box (inline replaced or inline-block). Eg: min-content of "I am a text sentence."
+ is "sentence."
+ https://www.w3.org/TR/css-sizing-3/#min-content-inline-size
+
+ contraint: min(available space, initial containing block's size)
+
+ available space: this is either a measurement of its containing block
+ (if that is definite) or an infinite size (when it is indefinite).
+ https://drafts.csswg.org/css-sizing-4/#available
+
+ - - - - - - - - - - - - -
+
+ Inside this batch of 24 sizing-orthog-vrl-in-htb tests:
+ 001-012: body has 100px margin-top and 100px margin-bottom
+ 013-024: body has no vertical margins
+
+ Inside each sub-batch of 12 tests:
+ 001-006: containing block's height is 'auto' therefore indefinite
+ 007-012: containing block's height is 400px therefore definite
+
+ Inside each sub-sub-batch of 6 tests:
+ 001-003: containing block has 1 sentence before and after
+ 004-006: containing block has no sentence before and no sentence after
+
+ Inside each sub-sub-sub-batch of 3 tests:
+ 001: orthogonal block's height is 'auto'
+ 002: orthogonal block's height is 'auto' and its min-content
+ inline size is greater than containing-block's (definite) height (1 very long word)
+ 003: orthogonal block's height is 'auto' and its max-content inline size
+ is smaller than containing-block's height (short sentence)
+
+ -->
+
+ <style type="text/css"><![CDATA[
+ body
+ {
+ font-size: 16px;
+ line-height: 1.25; /* therefore, each line box is 20px tall */
+ margin-bottom: 0px;
+ margin-top: 0px;
+ }
+
+ div#sized-400px-htb-containing-block
+ {
+ height: 400px;
+ }
+
+ div#ortho-block-vrl
+ {
+ border: blue solid 3px;
+ height: auto;
+ writing-mode: vertical-rl;
+ }
+ ]]></style>
+
+ </head>
+
+ <body>
+
+ <div id="sized-400px-htb-containing-block">
+
+ <div id="ortho-block-vrl">123456789012345</div>
+
+ </div>
+
+ </body>
+</html>
new file mode 100644
index 0000000000000000000000000000000000000000..461467381042c40e60433108af55569e2d022119
GIT binary patch
literal 1729
zc%17D@N?(olHy`uVBq!ia0y~yU~~Xs4mP03*$GQm0V$SrM_)$<hK>E)e-c@Ne6}QS
zcNd2LAh=-f^2tCE&H|6fVg?4jBOuH;Rhv&5D9B#o>FdgVpGks&L+NhD<7Gf0$r9Iy
z66gHf+|;}h2Ir#G#FEq$h4Rdj3<Y;j-+=H&K5?MwlAbP(Ar-gY-aVZilge=HVfiF8
zvzJG?gL*?^w!BjE5X({yIr3=f)mXzFf~v1hi7oba{LeJeDSEd+Q#V_9(%C~ztQ(K*
z%5XiY6tUrw>)Iwq&12D*pB2TV7*6*&vt+G_ajo2pqd%XWnfb8h!()}npO=P+xC%DB
z4wxOxz@gB<z(g@Yxd{-0O0Ib!LJh|#G*HD)R12R51}j$TxQIHDg)@9i`hzBl_#GD2
zm}6JKN>M6^v1gofXF^S&%FZ+H8xvoe%hoIWT=}e2xc2n_4`1zGC%xZ4r<O6i;s5OX
za`o9+$Lww=8#RdWKlnL&^1FYnkJrEV>WcQ^*l>s`;?9gES8go+a=czXJ12cp?cYNm
z<FBjA+vGYmi0x&Xlj&b4<6|XO`R_-9(e1pT1~HxoH_x8D)-G26Z!i1gZMtf#83!5a
zY$tpP$+0iB`uVElteyUBkp)MYew2rAN?TC%X7S#W_SLJ8$5koLjLS}H5aW9AV_Qmf
zd1dw6qbkat?>#;}J^JZK`F7RE{Iew%xH4IUd-?IInTPi5{p@+ka$?RLk2;H>z5g#>
ze-_VNaF#h@))~>etVS2--r2pm>di;yr~Bu<ygUC-*vC83{%VuUXUHsIUB|HhrT@0I
zTKV7SdcU)Yy!Xy>ri^v?y?MF*%jTO}I!tE&aOqXbre|i`ot;n4TKTE$dB~)NuWIMj
ztIm9B;CR54FJW<c)0N%aPk!Hfa<O{V@m+1=@3xm(NUpwNS5^M0dOau8tRGw(${seG
zyG`~@2g<$7F*1v?{q{3Yn8hTM;k9nfha3Brm~1b&|7~Z=>3vU}j^0>(US+eG2g5AG
zhOc6F6^{zU{)+vac-S-j=sw}slljYMsVq3jwByPl_FgMHi+Y`gWt<O!xaCb=CBzq{
zZSG{6rO~jJTmFsJ)H9_iC-WyQ4_9wLwz~i8^=>t;j7bdFqJJd(xVt2`>gDxy^E~rx
zBW%qKCWyqUac49!T+^$$P^qbDm-pxE_kNYd)3y4_fB!LL3@ZV<^4r9eyZXKI$&X!%
zmZdee`0Gw!Sn~yJ-tm7w<3F0Nn(|~H^U0rG8_mmA>dWHqp1<`%iT_`(8b^ZjE8Uuc
z>zz;Kmp^wYdh`6#w=b(ww%u=G)HVTmP(sctZ${L=jl1+zjNga%+ip+)XUnkelz-#V
pKl~Lj>khqS4yQanIduOJ-#zu?4dLpAHo%&M!PC{xWt~$(69DO<Hx>W@
new file mode 100644
index 0000000000000000000000000000000000000000..3d3a3c029d3b6db0cb0c3770dee98315d42ff94f
GIT binary patch
literal 1700
zc%17D@N?(olHy`uVBq!ia0y~yU~~Xs4mP03*$GQm0V$SrM_)$<hK>E)e-c@Ne6}QS
zcNd2LAh=-f^2tCE&H|6fVg?4jBOuH;Rhv&5D9B#o>FdgVpGks&PgCZ>+!a6}$r9Iy
z66gHf+|;}h2Ir#G#FEq$h4Rdj3<Y;j-+=H&K5+&H)<2#ujv*Dd-rhNzEmJCU{Ns7E
z%-l=t@)NRD9xV*zcP$E#UZ^A{FSS>+TRd>lyd1+SkuUlJnp?KAD^_HDP`M_f6Csej
zraf$mTobFd?G>#Z8b^OzX}9TVm-(hBz4_v_ck9-Rze%jKHkMZVkai+%-_k`IT?~Kt
z*A{RxFtP|ZP)ty60+gVVYhszG<07i~iE7~^;4qzmIxeD4WZ?>*hHn?&3OPt?PmN(N
zZ(v~JP(UKk`4~j_%`3m2Y*sqCzee=+^nX1ke@~Ks)u+uLH*<dJ#`E##_Azn9n8v^N
z`t|yn-Oaar0xt@l=llFB(~GGubq~6u(%{goxz0Z*>s{!txAV`J7HQnvmiO@2`RvKx
z=ZQEha6Vh2dcR*~wOHl<8y-ftRT~`Gt#%vU{B+>a`~AiBo029oFv-3+{V=8Y>Nnx#
zllA?szx})jDD>?7y_By7Z*Q?zPul<O%DTNDVvP2>F*NcS?KHi4E&OI&vF6DNBZGN0
zbt^ahJF9#0Ni!2iNypBhqAZo23$xy??VmKSXw$+uHRU_X{wuFPBd^?Wz%+c;sro9e
zC3mLZu?^Y%?Zv-S_2+rsc-O70df$6|^2*yR0xuZi-}-DT3*W|mUUmEY6*>8K6J>0}
zZ_az`wQRna!-BK1aWj3c+CD2QFo~?)xan@O;mM4*cIWp^IkQH{;ek~4H_r)f{*5)(
z6Krb2-$uQ^ap>>19#!?#+xqX!{9~oi;2^zPzUIR%mrM0!59|J>Po6BiHGBR$A%_LN
zrcyN@PTX5!vc2H`x}7PP?>%w4dh4{m>SkRV1xJQPSCI6Lg*v}<KRLHgnzyR<^y^9A
z+gSuMjJ<j7GOlf$__LT(;ey#TshSIGn43?|>}BHEGV#|zc56S?;?<j;n4i3?J-K=E
z*5|(-S2D8Pa#?(kJvm=pd)aimvZp>ppBry&efV(63sHv!yjS?`UhJGBB5zjzXYb>a
zN1m?weAlYpkC7!R3aBSv&hOg4D}OA_rc5?2Wfro_JIKh%#Bn9V<VV8qeLw9#ny#Mm
zWZvJCKUZzNzFmF)_t=~Bx879b@8+!*a9H35)L$+W|F6<a-oNi(#Lao{{L;#IF|$O4
zfE=^<WU2V{`gQlXPoCMmHT(RVdH;LD0=2ppeaLP%3)R}m_KxZWR)gC=ws?`ZkKOy{
ReF0V$44$rjF6*2UngB=S{h$B<
new file mode 100644
index 0000000000000000000000000000000000000000..b0db0c2e4ecacd72fe8b31fda42ca1b58b697ed6
GIT binary patch
literal 1732
zc%17D@N?(olHy`uVBq!ia0y~yU~~Xs4mP03*$GQm0V$SrM_)$<hK>E)e-c@Ne6}QS
zcNd2LAh=-f^2tCE&H|6fVg?4jBOuH;Rhv&5D9B#o>FdgVpGks&Mf79>=Te}MWQl7;
ziF1B#Zfaf$gL6@8Vo7R>LV0FMhJw4NZ$Nk>pE%HT8BZ6-kcwMx@1D+%No6?puzc1Q
zvzJG?gL++Jw!B*8A(o{aa^%s{i?N0~1XW+15?k!;_@8N_Q}k|urf#<Iq_c;bST|nV
zmEn3)DPqGV*ELNGgL<~d6<O+~8BX^(vm|tu<UIDY!hM#-X+?HF3e_h64APpU6tnlx
z%jU4Hr!*N@1RNL`i6S0Uu@qD#e{!ApDd}f;p|+Xc-y_2OD)v`x^H$aWw0Bs1eb<f8
z`swipL?8TrcKfbp{@okt)jk{-o-ytzD86L8qu|fiSkJ<4PsXqahHmM}Q)ca+TKE5Z
zaxcG%wV95L{eHWj4>Bh+ZFwpBAjkdF<AP0T6My^js29tsv1J@)@XPbtX1nFb-}kmN
z*4#=;YB1w@aNYUjwN-DIpHqpSyYlw)RAJ^VkqrM|`Ca3?+E=^9{AYFk+Z*2cD#ovU
z_%66H&bcw~&5M;e>vzvd(RnHDy>Cy9<o|cuQXVBvX5Qk-@Z9_4%ZE>vt=d>_=ecXy
zB;VkZ{O(!b?SDo6G-SAL+pzRy%;oJ4%c>?-vu7Qbvk&<Bdgi{rC)bC5-}^PisJ5Mx
z>DB|T53>)ZRHvuz{vT8HeC4Tc*Md)OES~yyXJ5**NMV*O6%6aw_$_<A?^#)fN@VrQ
zO?OK*PkOwyJHLO@nRSMq2TJ)8Hs5E-{GvPI{qITc?^nvcmW$nSf7`{BJz2kB+&!6J
ztHzn}Q2W5IR{nby^S=1$-C195BxxUK{q1MoWR@)%4AQzaA8zbhVzR&Be&5fO)BBzz
zUA?jTyh^c{2Sb!$L$8=!#iIhTzal>;9`+2sx-VFI5<k0-$b}@vn5>7*X>%p?<hd85
zGVQo>i2bb9jrnu#=4@&Z<4X8@h<&%8`seITPt;Euub%8Iy!H66&#seMw|Ic;Gx(La
zDJ$*e@pbcj^K2um%}l0<+*RYrXk@siUvr^URnso--^cI$s>j!d$iDyf$&fLu1nkOh
z6I1@`pOsI(98$C`ud&5ncLKwjFAQc;KN6n*`?UVYtWd9_`;AYWuHKk!J=wnM-|g$S
z-YD_^>s8}O2$s^VDY$;}seJnDlTU7(pZa#@xs<#MOBl6HKpvEk^~~F`<xg^HyieNw
z^|IA@{y!}l*8P-C2&^kUepPFZT>&eHLIVR6X#^oP2fQxMTvQ;&5Kgkm<k&_W!Sq6e
z8jewDpo*WsE~1WWtXQezBC7a_YT={M;KztlcEhH>%(WBV-(AJ`c^$AaVeoYIb6Mw<
G&;$Su=QfxC
new file mode 100644
index 0000000000000000000000000000000000000000..af756b7ba6b81ed8e10c91b423ac8cb07ea37d30
GIT binary patch
literal 1705
zc%17D@N?(olHy`uVBq!ia0y~yU~~Xs4mP03*$GQm0V$SrM_)$<hK>E)e-c@Ne6}QS
zcNd2LAh=-f^2tCE&H|6fVg?4jBOuH;Rhv&5D9B#o>FdgVpGks&+j!2`3Dbc>k|nMY
zCC>S|xv6<249-QVi6yBi3gww484B*6z5(HleBwaU89iMbLn>~)y>m8Orc~zm$Ma^M
zxtG}GCuA*ov@n$4u_z#Vp^}(<)LzkM@xVp%aty0PzUT{RZrRGNSdsBT<(iC6gh2M1
z_OK~(O|06sN3<lgj{dl^rBZ_5@=fxrwQEgw?~B{e{`2jboEZmZE6)Bot!t46)0SmH
zCrx*7X~!@*Ffg(RkVrJPExV=~FXH*{>FS8>U($Q*C;SO1zVl>S_UFxd-+qQ~TF=1r
ze`bEUs&v*hyW4O11Tu=B=lfN$zq%fOf2PQG4uuV8M9kGRO}}gXt@~L#_s+ze=;-}*
zdA^?xUS{Ihvhrr%lj93ho+`bUm-c#Q#Uha5EG#|wEWhr*f7SeI+Gd;z7uxp8`TWw_
zHs5M)P3f+*`O{eiGK}lLs;p*PeckTX<Uf0tSG`>-K56DvplK67u06T!-luP`x;@<{
z|GW6)bobM*@AJHm$%{EG@I5nqQn2$$U(xLMHIqvG)n2Plmgft9U;kulYch+#j(1+c
zJ6A1tP^+F?T^_RDcHjO#_l^Jlo)oWruln`LlvjL=EVmArGoQS6?$ftvn@`SFKXtoS
zebVCe)3=LdPoCKfw0nnl?8%U`$$9MUlS3~*ef#dE%HgZOZT@>1?G9pSe7)wTx}%gW
z>!;fKPcLk*X4@)%{hcf4=@*tGztj5X+IWUWu`uf&4|+GI9CrCzC#^PVa`M&e`R|1s
z7Py*9)qJ>dZ;46#{`})Ln=<o@7AC#Dnm%b~s+EExL*wZzlOGQ{og=?QKXK<%y({|L
zZ=J8*9mNKR?#QeUj+^^<b?109G)~)i<w0|r?2SotZfZ0*aIciD+3-2UXupwn-DI1~
zQ)Oh<+g+cp&!uodNs8A_qS8FlaPyaqv71k>WnXojjeYVWccAkEtbZ){9TZe^=g-IQ
z{c6e6wa%6QK4i%%5OEEtr{Z_Prf1Wio!?kzWEpI%@bGe~8OU)~y=?M1_qTsg-<LLZ
z(w*)0mhl_EJ^S{g|6ca*&1Tk57GB)I&dBo0M5?CX`bTYh|N9@Gyg2{#?aXs2c?V<_
zHuwO2ZeTR$jzR6y=dX57II}N)@3%YeTF*!DdASCP)IGhh$V>G)P+<cD69*E3&L@Sq
zFvo8?LsUfI4z_m~S%LJ7gPov`F^nag)NqV|16BM)weWFZh$X9x!X&5@S=0(20f*@f
fVAhZNAMEK5-#`3zl|LI;V=#ES`njxgN@xNAsoeRa
new file mode 100644
index 0000000000000000000000000000000000000000..7d5e9a4e24f28a5ff227abc6a419b95bc3b20636
GIT binary patch
literal 5113
zc${@tXEfYjyZwza7%dVldW{;Q1W}_!8J!_ATB1eoU6@3Wm_!R<OmrEB=$$Abh(wPP
zo&V@EjNW<Ob>DmMm-p_q&f4dkwa)Y9to=NDzcn(@qK2?Q005xY(bh1zW;*}?k&_c$
z@5F_j{$3M_v#P!-08}PWo<AkMK2vyWTlxV2&F1y`4zeF^Jifjp^ViYWBwL`OyumDT
zx^No`0Jq-gXsDV6PvJA~2LCfP-gEULdrz?!wgg+~fGr8jLE>NK{}5y*&Ho9z2Z<NP
zF~j18wNj0jVMefGZ3eS%f|7A&Nx~+YMig-td`45dsSnrM|2ht!c9RIdrrgR~j!xxJ
zdUv?0G+HArPE}raxN;-Nxrp8XJcx*AC-{fk@Clf8{e?@$)3tnXLA^<qO1V~@%61#e
z8==87DhcZaLxXGZ1f)_`1~FOWai^;9cW+w=CtaN%;FyR=GM>uF3LtdhtwgA<|0>J8
zzHEw_p(CM;(WDzw0*yH4T8YA54<z)^0cqlWJyIv(lI?#PhK?`G6OL4}!M(K(OTQ0r
zGq#Utk0v7LZ7qb;O5=jEUki?}*4~p^|Jj)jJMw*I9MdoD7CyqR)Vxk3jVo{I*6bi_
zXNR7FfJOA;cZuN)3MQbzU^*jp@Id^+)G##vhzUZ9WGO&)_0?+uTfbQ=Z)S&VQuVC5
zW+uw+_RP;`MJ!tCF+o$wfHIBG^pVvcpQ?3DHEvsEtps4lLx~pRS9y@75@|olj%qT<
zfKz8;K4b#W-qq+>ze3UVB5YBrJA&M@O11b45dys@+9pA}3gTdEb%PoATk4!+&$(vJ
z+(WzW4u=_?-Od@tuO`&1B!N*5`>?PO_}@KCZ)c4z|NG&}-6Ldo&s0AG5;kBUi%-*5
z{+vO_$L6Jj3kmQS#l=X>Xl5=(c6l*56_Lo#+waZI2z+lU5@%oTh{8emC?o+Rs~?-k
zh`JTB5ZqVR_9B~`jBo|4`PZN<!xkwb#6!iU^N~RoF8P#SC!lwprl=`&Zb49-4w5ya
z?$~T20a!5H<v4dh0Adycr@*^16`v%l(tKun{nXbcl7yZ#&aKBX8@{8LHF2q00J+mY
zVU|qOkA-Pi*1HCBL_#N7>kMaU#LUB1yL~^zO`b%sB4G*&aU89p)EQ~(>Dl*FySl))
zoX5&U9pt8Tw#~%~Th9T&HkY~HKC-W|tK;s}tnt2v<g&I?E=pMBLltkgmT0$1BpDzB
z@AcW7U5V$~sNts4CvM^y<+qogJLg-ntFuZCjgzevfQxu~GhzaFIX}9~R)OMuermU&
zgVnHRe@KNxh3IAFg$r)eLR&7Rx?-xAsrS8v1;`lki+)1z2Y>GQHkGN9J)fE~+1Z>Z
zj}0jP7VHtKEbS4r%eDH9<OWCspnLdl()hPV$hl%QnfB-gHV?oirL$~1mx1nvRu%=Z
zJpzh9<%hW>zmw-2vBdZm@|I}PXqWMw1mCe;e>~V^60NtC5P2ouKaqkXEr_e#Y@YUt
zv~bwu#G5^_2j;Zf{b~^YSTQ0*LL}>SdE4nWtFq%$s`j)vKP`pt{#eh~(~o%OCdBpC
zXFgIXX$sE8gN~(GcP5Dvg~#KBlouQgsB)F8_)z8kDKD70axcl-8FX6X#ec)P-b7}`
zNVML>nlz9hyu}(97jsLQk*d6#*$TA<MJK#^wx<{sAG1(rWx$)CrL%sR(`n&tnDNJs
zil>-+qQ^_gYc#BgnD?f<@J{xA^XZFqkLMSMFd6sPVHN8bKNQOo1w0s-a4`)F^BP{S
zhO|=n3^#!v9}k9ocx#Hl&_1PzQoZl=^%LH8fN*>6dy%8XP!m`I$az*?QxHTa9pHv5
zbS5^s>hPMG9g#+VgQXKK=t^gD6`(pPzx}!#sdWB9N&OoWY*mT=)@@Nu^J5980ME^j
za{VL0F1g;>Vi&AmGlzO`_yY48)#8%zeK`(B#wg}|JMqDH>>pu#`V=|YD?%TjDBQH>
z?5fXuoB*+{r49($Q7(lmDbzn_xl5eUef-k5^d?T}5=wSQs&u|V(N+$6Sl*E?G(qUT
zH{M!3C*$gV+h|Z%KAjga-p@|3-S5ARyg%krq4f|0e&B$pZ?}&xJL$Dw+0!VAY5|R~
zbknoWtW^G;^PNwh+H)o1G<)y!C>p;}bztf4&0yupKd)J{)ri71v`e8w9SM#eA!Rb>
zIWJuxFPvwy?NVG?ez{mh62fyIL>P?FWYx!p0n)=wmYqh`Z#N{n#$wJ8vhLZjSnRH-
zE!^dzL`WmDPQsgQ$RY1QtdBMS{4LUQ<J=*SI<$X7Q~sxkC-UU4%+{jtw*khU&4|NK
zd5wAI^t~Khdza?=$7Y1QRpw8sdpz9(Vl}xwD1i+~_Wje0e8f9e58KSln2W7R^H}6T
zto{04iPJpy!SHE6vXKm@Q2L~4q~ZlfmLpH)a5cKtU?~uB=#e-*=`4d5`Npc9=J#gS
z?J$}KGUPDQ1~CO#l}bEoBhsHot!Q=_f-d*&oBHG$$yJz<=zv#e^*JzN(Bd@si!z^J
zEcvG(=XuTYeD(OO-eIZ#D88J|lzgZrLKt#ahqP1k*qYu;xz&mq`|0!;Pf?~}iq(8B
z`JLt)82gN$iPne8L!()8&PZ|IB!OgTTwM>#Pn=!0>Z+Zfl`s$ARfZgJyaHp@?)Y7h
zv}czM6n{8sE`7GP3NEONLzzH*tfEE@ESW)e)u|(*81xR9DE?efCuJ1o;#(tdgJ5ta
z;X0<FRCWBIH<j;d+4Eh~pA_Mw`=+yj0<bivKD*A7=cJ`{*6N9I_iHU*^DXF#DyDMC
z^b>0fhgWWe_dB858y}1X=Sf$mfi&SIb`Oe~UQa}6Ga=8juM`1q0oPhKEd`ILLqTa<
z3yWBTP<8QN==a-{{5p|30{hF&xr(K_;nlvj<GenyZ*em{>1aw$XAnYZ)Ad6mx6`{O
z7t!5{5T{3L9c?}hs8a4nQer<-n80>6GkuqLBw9?16^ZOV^q$bEpLB}eYwc%{ZxVwg
zzf`%pd^+Ni%ELI$1qTPBU1YbJ4&>jD?xQG#tIg8BzrUTcb~u>#wu7;gP$x68-L`uZ
zdeSU`@K!#Mzd|k|NmUSqoYzA{p;T9G&X;tf6U;Z^%b#zk$9*!sG-8GM<k&CNHjL%N
zkBX}}Jk(W6Yvv>-XM`Xp@cu<c$^pd8)=X}@;&mAo(N-(t-Z-exc2$r>I5ydvxZ#RT
zJnpodSQ}fIJYfjT6sC6kjOOf26DjlrR9e6LjmzGqxs_;TaK}pvoOR$Q)0wtu$%*Lk
z3jZp)-b179v3xvuWDmGEng1h;`nYCP89|3Z>|CsB7niX~a9IlroJ4W}?U6R~Gr0Ul
ztClP$kfL?uI|q_wLD0G{|LxOoS@43v4EYJ-vkQ6=dY4yZadA3!2ovfrhw!hYr#(Lk
zBxz@8oe3^IQG5Rt8@ei~2MRuKOL!R^66Jz70)%RV*UFod8gDX5e(LYy=yxR9kz64n
z_@A8|J;bzP%*JwoUBU@HWyRZKz9k~~-DnpvQ>KzaWgz&*>-z|r6{~k|Q=Z`2ZatYF
zZ2#g}RTbJIYf0B=gn4}~uh7QMB_^)F8#XPm7c)1?JIr955|H8aJO<;EF%GMA@_+Pf
z`~aLojM8<yfYF{iz!)SW&yUVtF$Io4*=(;@cphU}VT|7u&_#zNYL%<%Ss4kK{?1pQ
zc<PUx%w#hp5b6Im@Xz7<M){vdVLVNu6+}W>Un<;M$>8C%XV6-cJWGPactD=2!yERO
zYtIJU%(ZD@^h9fSvrX{B=U3bOXl_&1X)bF<O~>~x!;VrJ8mS7I15<MJUT^l~dJ9d9
zRX`~!edi64r^aPEjf(a7v@*eTIZp4dw<IWs<t+#@PAR9J{)LX;>c7M^-uW4D1Yd}M
zWGJGh!%VytEOzsa^DBVE&CxhWFG}X8BZYEgl1QM`r?2_xnr5@>b%$2|fyVYgkBCpJ
z(4r#4D&)c|D_FXj>_eK!ICCp4S81l>d{O=fQaRbU6X$Fsp0@ZY1Ynp|tHcv$)D?Nh
z<~x1fe4I%1FuMG7yQAla^G?5PU;0N6+U?4PLqBR~-Xt+|kBnZG#f>jRmzQ)d*6L{6
z{^U-V5bx<)oQFBFOl>U0_Mmo-YKU;Mopz>KQ2YKB-Yag+u(ZJAsKea(qYJ4UuCWi4
zQ4NI_+bS$wN>fu&Zv1dtfr^|V{?ZTCfKT<HHb916P2D7G*YK9I_(^)HJ7b+nx^P-Q
z#W+t6b{)i!Iol`l(9g>k-@}ahFeYiLsLv@i%PRmnC?wsV{QY3!AL^Xm>$WTjm&U8U
z*NgRT`J;O}%{Ek#Bx4GT5{FWW6G=N46)iO858%GQ`a*Nv8{V-JvB*@fcvKXY!$t0b
zrOO|g9gj#LJ!~@L%+ESMOWrG_5q`oh53D_a|6#BuK+}ja^kVR-*)!2+_H~7pI8nn{
zzQ>;S)r><G5@YPw-Ou~W7eLx}*=~I`Xn~`QQ^7R(<1}?CNx?zMZ)Kv<T?~5(NdL}<
zZ+)SbUT&4A7KY7^9(Hi2*Ws%z?4Z!C@ygT5a?<^dn3hkV`Wbeq@b-T9?RPiadL6AQ
zpI&=$V)_LGtGClDkC-h<R-ZC0&~y<uQ`nlrmruzN$U*nyb$v1u9mcxDA#=riPx}`v
zmv>mC*{k}y2lQ$u?|9=Paz3nH#+o;E(?g;e(1&^mTD))b80%utp<|YVTXM}IU74VM
z+|oiK8ym;e<hjkQyf@(g(Z&D9sQ)H4pfn9%r$C?kxajuFc0EDUAFtDKybh7@1|P<7
zV_N2|HO(_?oLrDtAaZuYSBZ%baeQ{hoO8bJij(|C6x?*SNh@yaE)*8t>Z;^>4Yj>j
zmmi)FRlGo@yE#SJ*A<L64N{K_MK(2+1I3H_%-&y$TgQ%bZ0;+u!paDfn|>yx7W!w{
z$>8eA!LxfHmloH<MvLa{{o>}nKU5j3m6qZ6SQUcOM+|}IL#>LL>!g4FX!_wn&Estk
zC<kvU%`CdtDkz#gEWw1pzA)^bL~iww@XCA=qxYkuE&WyXwY!Q`GS$4m<_A+*<h!h`
ztCRh(#zeuCxCe7k&K~LV1F<YJ$jstCtll~6@W~B}yh%43zN~|U-E8x-*w3m^Oi0Gg
z8U(N)>{mTVgfE-5tN%{Xd`P7q#@m=tbm%#7OBuo}LXbn<!^G8wOLj;+8sNrJ6Hp^f
zy2*isA*Dg49_95iPBiU#T+5`xlw;Ol@|KYt)osb9h5$-*MM+%=n`Q=5KwaU*RE=!%
z68lJY<&!}T<@xvFZ;_7%({I$M9<7LOfC<4DLdli01ovO}#3@;pmPEk-A-lzToyzl_
zob>TP(^Q$W1TYj30Mq@djCcOLSzKI}k^8)R(ev)*-jf~tv&mcHu$u?86Zx^aI-+Lo
zHA>Th2EI&3+j=p-^rAirD0w8sdmm?7I{kwbzn?D6v<fU3rv%N(yrM~2>VL&MF~uc;
z3%Hrs(;O}mcj)a27&!(^AZ*;@Yjv@sXbdH^r^YIN59JG;G}Nb!vq{bKXf2u+x>vOr
zpC`=MNISv%5VDg=?XT*wyjLHTKdtbVqsD}z2lPI`+V-+WPf{9h<;8i&<i{CkAxz8y
z-o||=)o+3q*z%WHpF~20L}C)kv<-pw;M=P)%>B#n44{vo)nl^oUknjIPTuE^)~UD3
zqYA&W&|>47fSs)1QR{o^Jay81t%2Y5dX_d1ntX%oflD<P!wq8K=+~5rkQ!EoXki6c
zhoL~OTdMk@JiEQxb_$%cZlOKg!VU|VmNC@DP6xzSAzt-vmC^s`r;d06yvC15)U{Is
zVu)r6mphcv2TggC>1StY^TfT$Tv*KV`lv76*6#yyggAU)@(Z#3Nll?;OUN9jRRbey
zAbNH&V&d7>@572__xsz>=~<1(_4$HO${A)uL==xsjLvA`_7H<k@+ivr(cs+9GqHVN
zj@Z#SF#8X3-y(C-kFFg@J#+xmW�a#eHkCo4#z&bTX5qge<VEVE}A7r)IUf#j(KS
z)pY~6n-?)^3063aBIn}ye{x|?RAOnfLvh|va=_3WIj0?Yj%*$>`nYFWqUf<{sn)eI
zeM5cS6#o5?otn$~r=Nhxl5OO5ma_{#TWvFMN%#eg*Am&NG8*9L1&K?w2;-<Vk{eA*
zt2K+3Vi+9j84A(KR4kJ@ZYRsLb<n!<y#g083%BkAhAjWfPTP49i8xCa1HZnD`06Kg
z>1gsx!)v!B7@3zi*mVN*3?a&NpOwH$Qs7wy_+MVuA0`AF4ZAY7$LcVVj%Ky7;xDBB
zc=`8mznK$S+U^0)nGSqss)Kkh_V$D(vVn%1UG%HpNom*<XV%{VTq*uVqTMfvM;MGj
zz(+q}_%XpFG0AZumm-J%GAgMsPi~Cjs2wzH!>j+-IE6eX`X36-8DI!Y4gu9@M-!n^
zXxop)Z2zv24DqO)m~>Dt>~Jc#MwR7iHOzh^ET5t{+t;@Cw%M}FYn-^Rig_TZ&m?dD
zoSZ1@v_+ztX$Awb1M5*0Rf+?4P2ibaqo-P%v{X}Ld%ugaGx1>!k0a$iwieZqW$^Zj
z;;e~TO5$l`3<XiN{6T1T!gO)&?DM~;WD;aSiY;t6@Dw|W5h2{@!~gqK|C-(DiE>+t
bXolS@8k;vsB8EeZz%_I<4K&Ks>|Xr~R`s%8
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-003.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-003.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -39,9 +39,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-005.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-005.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <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[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
@@ -40,9 +40,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-007.xht
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-align-vlr-007.xht
@@ -3,17 +3,17 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<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="../css21/reference/ref-filled-green-100px-square.xht" />
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
<meta content="ahem image" name="flags" />
<style type="text/css"><![CDATA[
@font-face {
font-family: Ahem;
src: url("../../../fonts/Ahem.ttf");
}
@@ -38,9 +38,9 @@
<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
+</html>
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-combine-upright-value-all-001.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-combine-upright-value-all-001.html
@@ -2,17 +2,17 @@
<html>
<head>
<meta charset="utf-8">
<title>CSS Writing Modes: text-combine-upright: all</title>
<link rel="author" title="Masataka Yakura" href="https://google.com/+MasatakaYakura">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright">
<link rel="match" href="reference/text-combine-upright-value-single-character.html">
<meta name="assert" content="'text-combine-upright: all' rotates the composition even if tate-chu-yoko">
-<meta name="flags" content="font">
+<meta name="flags" content="">
<style>
@font-face {
font-family: tcu-font;
src: url("support/tcu-font.woff");
}
.test {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-combine-upright-value-digits2-001.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-combine-upright-value-digits2-001.html
@@ -2,17 +2,17 @@
<html>
<head>
<meta charset="utf-8">
<title>CSS Writing Modes: text-combine-upright: digits 2</title>
<link rel="author" title="Masataka Yakura" href="https://google.com/+MasatakaYakura">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-combine-upright">
<link rel="match" href="reference/text-combine-upright-value-single-character.html">
<meta name="assert" content="the 'digits' values in text-combine-upright rotates the composition even if there is only one character inside tate-chu-yoko.">
-<meta name="flags" content="font">
+<meta name="flags" content="">
<style>
@font-face {
font-family: tcu-font;
src: url("support/tcu-font.woff");
}
.test {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vlr-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vlr-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: mixed.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vlr-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vlr-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: mixed.</title>
<link rel="match" href="text-orientation-mixed-vlr-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vrl-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vrl-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: mixed.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vrl-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-mixed-vrl-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: mixed.</title>
<link rel="match" href="text-orientation-mixed-vrl-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vlr-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vlr-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: sideways.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vlr-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vlr-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: sideways.</title>
<link rel="match" href="text-orientation-sideways-vlr-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vrl-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vrl-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: sideways.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vrl-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-sideways-vrl-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: sideways.</title>
<link rel="match" href="text-orientation-sideways-vrl-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vlr-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vlr-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: upright.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vlr-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vlr-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-lr; text-orientation: upright.</title>
<link rel="match" href="text-orientation-upright-vlr-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-lr;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vrl-100-ref.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vrl-100-ref.html
@@ -1,12 +1,11 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: upright.</title>
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
--- a/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vrl-100.html
+++ b/layout/reftests/w3c-css/received/css-writing-modes-3/text-orientation-upright-vrl-100.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Writing Modes Test: writing-mode: vertical-rl; text-orientation: upright.</title>
<link rel="match" href="text-orientation-upright-vrl-100-ref.html">
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
-<meta name="flags" content="font">
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
<style>
@font-face {
font-family: "orientation";
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
}
html {
writing-mode: vertical-rl;
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/css21/reference/ref-filled-green-100px-square.xht
+++ /dev/null
@@ -1,19 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <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>
--- a/layout/reftests/w3c-css/received/import.log
+++ b/layout/reftests/w3c-css/received/import.log
@@ -1,10 +1,11 @@
-Importing revision: 00be273354416756b2c89ecff5dc248009a21a19
-from repository: https://hg.csswg.org/test
+Importing revision: 8461f590f8daed9cffa3dd12cd2c639f125d9c96
+from repository: https://github.com/w3c/web-platform-tests.git
+Importing css-conditional-3/OWNERS to css-conditional-3/OWNERS
Importing css-conditional-3/at-media-whitespace-optional-001.html to css-conditional-3/at-media-whitespace-optional-001.html
Importing css-conditional-3/reference/background-lime.html to css-conditional-3/reference/background-lime.html
Importing css-conditional-3/at-media-whitespace-optional-002.html to css-conditional-3/at-media-whitespace-optional-002.html
Importing css-conditional-3/at-supports-001.html to css-conditional-3/at-supports-001.html
Importing css-conditional-3/at-supports-001-ref.html to css-conditional-3/at-supports-001-ref.html
Importing css-conditional-3/at-supports-002.html to css-conditional-3/at-supports-002.html
Importing css-conditional-3/at-supports-003.html to css-conditional-3/at-supports-003.html
Importing css-conditional-3/at-supports-004.html to css-conditional-3/at-supports-004.html
@@ -39,17 +40,17 @@ Importing css-conditional-3/at-supports-
Importing css-conditional-3/at-supports-032.html to css-conditional-3/at-supports-032.html
Importing css-conditional-3/at-supports-033.html to css-conditional-3/at-supports-033.html
Importing css-conditional-3/at-supports-034.html to css-conditional-3/at-supports-034.html
Importing css-conditional-3/at-supports-035.html to css-conditional-3/at-supports-035.html
Importing css-conditional-3/at-supports-036.html to css-conditional-3/at-supports-036.html
Importing css-conditional-3/at-supports-037.html to css-conditional-3/at-supports-037.html
Importing css-conditional-3/at-supports-038.html to css-conditional-3/at-supports-038.html
Importing css-conditional-3/at-supports-039.html to css-conditional-3/at-supports-039.html
-Importing css-multicol-1/multicol-basic-001.html to css-multicol-1/multicol-basic-001.html
+Importing css-multicol-1/OWNERS to css-multicol-1/OWNERS
Importing css-multicol-1/support/1x1-green.png to css-multicol-1/support/1x1-green.png
Importing css-multicol-1/support/1x1-lime.png to css-multicol-1/support/1x1-lime.png
Importing css-multicol-1/support/1x1-maroon.png to css-multicol-1/support/1x1-maroon.png
Importing css-multicol-1/support/1x1-navy.png to css-multicol-1/support/1x1-navy.png
Importing css-multicol-1/support/1x1-red.png to css-multicol-1/support/1x1-red.png
Importing css-multicol-1/support/1x1-white.png to css-multicol-1/support/1x1-white.png
Importing css-multicol-1/support/60x60-gg-rr.png to css-multicol-1/support/60x60-gg-rr.png
Importing css-multicol-1/support/60x60-green.png to css-multicol-1/support/60x60-green.png
@@ -80,20 +81,26 @@ Importing css-multicol-1/support/swatch-
Importing css-multicol-1/support/swatch-red.png to css-multicol-1/support/swatch-red.png
Importing css-multicol-1/support/swatch-white.png to css-multicol-1/support/swatch-white.png
Importing css-multicol-1/support/swatch-yellow.png to css-multicol-1/support/swatch-yellow.png
Importing css-multicol-1/support/test-bl.png to css-multicol-1/support/test-bl.png
Importing css-multicol-1/support/test-br.png to css-multicol-1/support/test-br.png
Importing css-multicol-1/support/test-outer.png to css-multicol-1/support/test-outer.png
Importing css-multicol-1/support/test-tl.png to css-multicol-1/support/test-tl.png
Importing css-multicol-1/support/test-tr.png to css-multicol-1/support/test-tr.png
+Importing css-multicol-1/multicol-basic-001.html to css-multicol-1/multicol-basic-001.html
Importing css-multicol-1/reference/multicol-basic-ref.html to css-multicol-1/reference/multicol-basic-ref.html
Importing css-multicol-1/multicol-basic-002.html to css-multicol-1/multicol-basic-002.html
Importing css-multicol-1/multicol-basic-003.html to css-multicol-1/multicol-basic-003.html
Importing css-multicol-1/multicol-basic-004.html to css-multicol-1/multicol-basic-004.html
+Importing css-multicol-1/multicol-basic-005.xht to css-multicol-1/multicol-basic-005.xht
+Importing css-multicol-1/reference/multicol-basic-005-ref.xht to css-multicol-1/reference/multicol-basic-005-ref.xht
+Importing css-multicol-1/multicol-basic-006.xht to css-multicol-1/multicol-basic-006.xht
+Importing css-multicol-1/multicol-basic-007.xht to css-multicol-1/multicol-basic-007.xht
+Importing css-multicol-1/multicol-basic-008.xht to css-multicol-1/multicol-basic-008.xht
Importing css-multicol-1/multicol-block-clip-001.xht to css-multicol-1/multicol-block-clip-001.xht
Importing css-multicol-1/multicol-block-clip-001-ref.xht to css-multicol-1/multicol-block-clip-001-ref.xht
Importing css-multicol-1/multicol-block-clip-002.xht to css-multicol-1/multicol-block-clip-002.xht
Importing css-multicol-1/multicol-block-clip-002-ref.xht to css-multicol-1/multicol-block-clip-002-ref.xht
Importing css-multicol-1/multicol-br-inside-avoidcolumn-001.xht to css-multicol-1/multicol-br-inside-avoidcolumn-001.xht
Importing css-multicol-1/multicol-br-inside-avoidcolumn-ref.xht to css-multicol-1/multicol-br-inside-avoidcolumn-ref.xht
Importing css-multicol-1/multicol-break-000.xht to css-multicol-1/multicol-break-000.xht
Importing css-multicol-1/multicol-break-000-ref.xht to css-multicol-1/multicol-break-000-ref.xht
@@ -253,17 +260,17 @@ Importing css-multicol-1/multicol-rule-l
Importing css-multicol-1/multicol-rule-none-000.xht to css-multicol-1/multicol-rule-none-000.xht
Importing css-multicol-1/multicol-rule-outset-000.xht to css-multicol-1/multicol-rule-outset-000.xht
Importing css-multicol-1/multicol-rule-percent-001.xht to css-multicol-1/multicol-rule-percent-001.xht
Importing css-multicol-1/multicol-rule-px-001.xht to css-multicol-1/multicol-rule-px-001.xht
Importing css-multicol-1/multicol-rule-ridge-000.xht to css-multicol-1/multicol-rule-ridge-000.xht
Importing css-multicol-1/multicol-rule-samelength-001.xht to css-multicol-1/multicol-rule-samelength-001.xht
Importing css-multicol-1/multicol-rule-samelength-001-ref.xht to css-multicol-1/multicol-rule-samelength-001-ref.xht
Importing css-multicol-1/multicol-rule-shorthand-001.xht to css-multicol-1/multicol-rule-shorthand-001.xht
-Warning: href attribute found empty in ../../../../csswg-test/css-multicol-1\multicol-rule-shorthand-2.xht
+Warning: href attribute found empty in ../web-platform-tests/css/css-multicol-1\multicol-rule-shorthand-2.xht
Importing css-multicol-1/multicol-rule-solid-000.xht to css-multicol-1/multicol-rule-solid-000.xht
Importing css-multicol-1/multicol-rule-solid-000-ref.xht to css-multicol-1/multicol-rule-solid-000-ref.xht
Importing css-multicol-1/multicol-rule-stacking-001.xht to css-multicol-1/multicol-rule-stacking-001.xht
Importing css-multicol-1/multicol-rule-stacking-ref.xht to css-multicol-1/multicol-rule-stacking-ref.xht
Importing css-multicol-1/multicol-rule-style-groove-001.xht to css-multicol-1/multicol-rule-style-groove-001.xht
Importing css-multicol-1/multicol-rule-style-groove-001-ref.xht to css-multicol-1/multicol-rule-style-groove-001-ref.xht
Importing css-multicol-1/multicol-rule-style-inset-001.xht to css-multicol-1/multicol-rule-style-inset-001.xht
Importing css-multicol-1/multicol-rule-style-ridge-001-ref.xht to css-multicol-1/multicol-rule-style-ridge-001-ref.xht
@@ -320,21 +327,22 @@ Importing css-multicol-1/multicol-width-
Importing css-multicol-1/multicol-width-invalid-001-ref.xht to css-multicol-1/multicol-width-invalid-001-ref.xht
Importing css-multicol-1/multicol-width-large-001.xht to css-multicol-1/multicol-width-large-001.xht
Importing css-multicol-1/multicol-width-large-002.xht to css-multicol-1/multicol-width-large-002.xht
Importing css-multicol-1/multicol-width-negative-001.xht to css-multicol-1/multicol-width-negative-001.xht
Importing css-multicol-1/multicol-width-small-001.xht to css-multicol-1/multicol-width-small-001.xht
Importing css-multicol-1/multicol-width-small-001-ref.xht to css-multicol-1/multicol-width-small-001-ref.xht
Importing css-multicol-1/multicol-zero-height-001.xht to css-multicol-1/multicol-zero-height-001.xht
Importing css-multicol-1/multicol-zero-height-001-ref.xht to css-multicol-1/multicol-zero-height-001-ref.xht
-Importing css-namespaces-3/prefix-001.xml to css-namespaces-3/prefix-001.xml
+Importing css-namespaces-3/OWNERS to css-namespaces-3/OWNERS
Importing css-namespaces-3/support/fail.css to css-namespaces-3/support/fail.css
Importing css-namespaces-3/support/scope-002a.css to css-namespaces-3/support/scope-002a.css
Importing css-namespaces-3/support/scope-002b.css to css-namespaces-3/support/scope-002b.css
Importing css-namespaces-3/support/syntax-007.css to css-namespaces-3/support/syntax-007.css
+Importing css-namespaces-3/prefix-001.xml to css-namespaces-3/prefix-001.xml
Importing css-namespaces-3/reftest/ref-lime-1.xml to css-namespaces-3/reftest/ref-lime-1.xml
Importing css-namespaces-3/prefix-002.xml to css-namespaces-3/prefix-002.xml
Importing css-namespaces-3/prefix-003.xml to css-namespaces-3/prefix-003.xml
Importing css-namespaces-3/reftest/ref-lime-1-generic.xml to css-namespaces-3/reftest/ref-lime-1-generic.xml
Importing css-namespaces-3/prefix-004.xml to css-namespaces-3/prefix-004.xml
Importing css-namespaces-3/reftest/ref-lime-2-generic.xml to css-namespaces-3/reftest/ref-lime-2-generic.xml
Importing css-namespaces-3/prefix-005.xml to css-namespaces-3/prefix-005.xml
Importing css-namespaces-3/prefix-006.xml to css-namespaces-3/prefix-006.xml
@@ -355,17 +363,17 @@ Importing css-namespaces-3/syntax-009.xm
Importing css-namespaces-3/syntax-010.xml to css-namespaces-3/syntax-010.xml
Importing css-namespaces-3/reftest/ref-lime-3.xml to css-namespaces-3/reftest/ref-lime-3.xml
Importing css-namespaces-3/syntax-011.xml to css-namespaces-3/syntax-011.xml
Importing css-namespaces-3/reftest/ref-lime-6.xml to css-namespaces-3/reftest/ref-lime-6.xml
Importing css-namespaces-3/syntax-012.xml to css-namespaces-3/syntax-012.xml
Importing css-namespaces-3/syntax-013.xml to css-namespaces-3/syntax-013.xml
Importing css-namespaces-3/syntax-014.xml to css-namespaces-3/syntax-014.xml
Importing css-namespaces-3/syntax-015.xml to css-namespaces-3/syntax-015.xml
-Importing css-values-3/attr-color-invalid-cast.html to css-values-3/attr-color-invalid-cast.html
+Importing css-values-3/OWNERS to css-values-3/OWNERS
Importing css-values-3/support/1x1-green.png to css-values-3/support/1x1-green.png
Importing css-values-3/support/1x1-lime.png to css-values-3/support/1x1-lime.png
Importing css-values-3/support/1x1-maroon.png to css-values-3/support/1x1-maroon.png
Importing css-values-3/support/1x1-navy.png to css-values-3/support/1x1-navy.png
Importing css-values-3/support/1x1-red.png to css-values-3/support/1x1-red.png
Importing css-values-3/support/1x1-white.png to css-values-3/support/1x1-white.png
Importing css-values-3/support/60x60-gg-rr.png to css-values-3/support/60x60-gg-rr.png
Importing css-values-3/support/60x60-green.png to css-values-3/support/60x60-green.png
@@ -400,16 +408,17 @@ Importing css-values-3/support/test-bl.p
Importing css-values-3/support/test-br.png to css-values-3/support/test-br.png
Importing css-values-3/support/test-inner-half-size.png to css-values-3/support/test-inner-half-size.png
Importing css-values-3/support/test-outer.png to css-values-3/support/test-outer.png
Importing css-values-3/support/test-tl.png to css-values-3/support/test-tl.png
Importing css-values-3/support/test-tr.png to css-values-3/support/test-tr.png
Importing css-values-3/support/support/README to css-values-3/support/support/README
Importing css-values-3/support/support/swatch-green.png to css-values-3/support/support/swatch-green.png
Importing css-values-3/support/support/swatch-red.png to css-values-3/support/support/swatch-red.png
+Importing css-values-3/attr-color-invalid-cast.html to css-values-3/attr-color-invalid-cast.html
Importing css-values-3/reference/200-200-green.html to css-values-3/reference/200-200-green.html
Importing css-values-3/attr-color-invalid-fallback.html to css-values-3/attr-color-invalid-fallback.html
Importing css-values-3/attr-color-valid.html to css-values-3/attr-color-valid.html
Importing css-values-3/attr-invalid-type-001.html to css-values-3/attr-invalid-type-001.html
Importing css-values-3/attr-invalid-type-002.html to css-values-3/attr-invalid-type-002.html
Importing css-values-3/attr-invalid-type-003.html to css-values-3/attr-invalid-type-003.html
Importing css-values-3/attr-length-invalid-cast.html to css-values-3/attr-length-invalid-cast.html
Importing css-values-3/attr-length-invalid-fallback.html to css-values-3/attr-length-invalid-fallback.html
@@ -422,16 +431,20 @@ Importing css-values-3/attr-px-valid.htm
Importing css-values-3/calc-in-calc.html to css-values-3/calc-in-calc.html
Importing css-values-3/reference/all-green.html to css-values-3/reference/all-green.html
Importing css-values-3/calc-in-media-queries-001.html to css-values-3/calc-in-media-queries-001.html
Importing css-values-3/calc-in-media-queries-002.html to css-values-3/calc-in-media-queries-002.html
Importing css-values-3/calc-invalid-range-clamping.html to css-values-3/calc-invalid-range-clamping.html
Importing css-values-3/calc-parenthesis-stack.html to css-values-3/calc-parenthesis-stack.html
Importing css-values-3/ch-unit-001.html to css-values-3/ch-unit-001.html
Importing css-values-3/reference/ch-unit-001-ref.html to css-values-3/reference/ch-unit-001-ref.html
+Importing css-values-3/ch-unit-002.html to css-values-3/ch-unit-002.html
+Importing css-values-3/reference/ch-unit-002-ref.html to css-values-3/reference/ch-unit-002-ref.html
+Importing css-values-3/ch-unit-003.html to css-values-3/ch-unit-003.html
+Importing css-values-3/ch-unit-004.html to css-values-3/ch-unit-004.html
Importing css-values-3/initial-background-color.html to css-values-3/initial-background-color.html
Importing css-values-3/vh-calc-support-pct.html to css-values-3/vh-calc-support-pct.html
Importing css-values-3/vh-calc-support.html to css-values-3/vh-calc-support.html
Importing css-values-3/vh-em-inherit.html to css-values-3/vh-em-inherit.html
Importing css-values-3/vh-inherit.html to css-values-3/vh-inherit.html
Importing css-values-3/vh-interpolate-pct.html to css-values-3/vh-interpolate-pct.html
Importing css-values-3/vh-interpolate-px.html to css-values-3/vh-interpolate-px.html
Importing css-values-3/vh-interpolate-vh.html to css-values-3/vh-interpolate-vh.html
@@ -439,27 +452,31 @@ Importing css-values-3/vh-support-atview
Importing css-values-3/vh-support-margin.html to css-values-3/vh-support-margin.html
Importing css-values-3/vh-support-transform-origin.html to css-values-3/vh-support-transform-origin.html
Importing css-values-3/vh-support-transform-translate.html to css-values-3/vh-support-transform-translate.html
Importing css-values-3/vh-support.html to css-values-3/vh-support.html
Importing css-values-3/vh-zero-support.html to css-values-3/vh-zero-support.html
Importing css-values-3/vh_not_refreshing_on_chrome.html to css-values-3/vh_not_refreshing_on_chrome.html
Importing css-values-3/reference/vh_not_refreshing_on_chrome-ref.html to css-values-3/reference/vh_not_refreshing_on_chrome-ref.html
Importing css-values-3/vh_not_refreshing_on_chrome_iframe.html to css-values-3/vh_not_refreshing_on_chrome_iframe.html
-Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht
+Importing css-writing-modes-3/OWNERS to css-writing-modes-3/OWNERS
Importing css-writing-modes-3/support/100x100-lime.png to css-writing-modes-3/support/100x100-lime.png
Importing css-writing-modes-3/support/100x100-red.png to css-writing-modes-3/support/100x100-red.png
Importing css-writing-modes-3/support/bg-red-1col-2row-320x320.png to css-writing-modes-3/support/bg-red-1col-2row-320x320.png
Importing css-writing-modes-3/support/bg-red-1col-3row-320x320.png to css-writing-modes-3/support/bg-red-1col-3row-320x320.png
Importing css-writing-modes-3/support/bg-red-2col-2row-320x320.png to css-writing-modes-3/support/bg-red-2col-2row-320x320.png
Importing css-writing-modes-3/support/bg-red-2col-3row-320x320.png to css-writing-modes-3/support/bg-red-2col-3row-320x320.png
Importing css-writing-modes-3/support/bg-red-3col-2row-320x320.png to css-writing-modes-3/support/bg-red-3col-2row-320x320.png
Importing css-writing-modes-3/support/bg-red-3col-3row-320x320.png to css-writing-modes-3/support/bg-red-3col-3row-320x320.png
Importing css-writing-modes-3/support/bg-red-4col-2row-320x320.png to css-writing-modes-3/support/bg-red-4col-2row-320x320.png
Importing css-writing-modes-3/support/bg-red-4col-3row-320x320.png to css-writing-modes-3/support/bg-red-4col-3row-320x320.png
+Importing css-writing-modes-3/support/bg-red-low-left-corn-320x320.png to css-writing-modes-3/support/bg-red-low-left-corn-320x320.png
+Importing css-writing-modes-3/support/bg-red-low-rght-corn-320x320.png to css-writing-modes-3/support/bg-red-low-rght-corn-320x320.png
+Importing css-writing-modes-3/support/bg-red-upp-left-corn-320x320.png to css-writing-modes-3/support/bg-red-upp-left-corn-320x320.png
+Importing css-writing-modes-3/support/bg-red-upp-rght-corn-320x320.png to css-writing-modes-3/support/bg-red-upp-rght-corn-320x320.png
Importing css-writing-modes-3/support/block-flow-direction-025-exp-res.png to css-writing-modes-3/support/block-flow-direction-025-exp-res.png
Importing css-writing-modes-3/support/block-flow-direction-066-exp-res.png to css-writing-modes-3/support/block-flow-direction-066-exp-res.png
Importing css-writing-modes-3/support/blue-horiz-line-220x1.png to css-writing-modes-3/support/blue-horiz-line-220x1.png
Importing css-writing-modes-3/support/blue-horiz-line-320x1.png to css-writing-modes-3/support/blue-horiz-line-320x1.png
Importing css-writing-modes-3/support/blue-vert-line-1x220.png to css-writing-modes-3/support/blue-vert-line-1x220.png
Importing css-writing-modes-3/support/blue-vert-line-1x320.png to css-writing-modes-3/support/blue-vert-line-1x320.png
Importing css-writing-modes-3/support/blue-yellow-206w-165h.png to css-writing-modes-3/support/blue-yellow-206w-165h.png
Importing css-writing-modes-3/support/blue1x1.png to css-writing-modes-3/support/blue1x1.png
@@ -561,16 +578,17 @@ Importing css-writing-modes-3/support/sw
Importing css-writing-modes-3/support/swatch-yellow.png to css-writing-modes-3/support/swatch-yellow.png
Importing css-writing-modes-3/support/tcu-font.otf to css-writing-modes-3/support/tcu-font.otf
Importing css-writing-modes-3/support/tcu-font.woff to css-writing-modes-3/support/tcu-font.woff
Importing css-writing-modes-3/support/test-bl.png to css-writing-modes-3/support/test-bl.png
Importing css-writing-modes-3/support/test-br.png to css-writing-modes-3/support/test-br.png
Importing css-writing-modes-3/support/test-tl.png to css-writing-modes-3/support/test-tl.png
Importing css-writing-modes-3/support/test-tr.png to css-writing-modes-3/support/test-tr.png
Importing css-writing-modes-3/support/text-orientation-010.png to css-writing-modes-3/support/text-orientation-010.png
+Importing css-writing-modes-3/support/text-orientation-012.png to css-writing-modes-3/support/text-orientation-012.png
Importing css-writing-modes-3/support/text-orientation-mixed-vrl-002.png to css-writing-modes-3/support/text-orientation-mixed-vrl-002.png
Importing css-writing-modes-3/support/text-orientation-sideways-left-001.png to css-writing-modes-3/support/text-orientation-sideways-left-001.png
Importing css-writing-modes-3/support/text-orientation-sideways-lr.png to css-writing-modes-3/support/text-orientation-sideways-lr.png
Importing css-writing-modes-3/support/text-orientation-sideways-right-001.png to css-writing-modes-3/support/text-orientation-sideways-right-001.png
Importing css-writing-modes-3/support/text-orientation-upright-001.png to css-writing-modes-3/support/text-orientation-upright-001.png
Importing css-writing-modes-3/support/text-orientation-upright-vrl-002.png to css-writing-modes-3/support/text-orientation-upright-vrl-002.png
Importing css-writing-modes-3/support/text-orientation.js to css-writing-modes-3/support/text-orientation.js
Importing css-writing-modes-3/support/vertical-form.png to css-writing-modes-3/support/vertical-form.png
@@ -579,17 +597,17 @@ Importing css-writing-modes-3/support/ye
Importing css-writing-modes-3/support/yellow-square-horiz-redline-bottom-59x59.png to css-writing-modes-3/support/yellow-square-horiz-redline-bottom-59x59.png
Importing css-writing-modes-3/support/yellow-square-vert-redline-center-59x59.png to css-writing-modes-3/support/yellow-square-vert-redline-center-59x59.png
Importing css-writing-modes-3/support/yellow-square-vert-redline-left-59x59.png to css-writing-modes-3/support/yellow-square-vert-redline-left-59x59.png
Importing css-writing-modes-3/support/yellow-square-vert-redline-right-59x59.png to css-writing-modes-3/support/yellow-square-vert-redline-right-59x59.png
Importing css-writing-modes-3/support/adobe-fonts/CSSFWOrientationTest.otf to css-writing-modes-3/support/adobe-fonts/CSSFWOrientationTest.otf
Importing css-writing-modes-3/support/adobe-fonts/CSSHWOrientationTest.otf to css-writing-modes-3/support/adobe-fonts/CSSHWOrientationTest.otf
Importing css-writing-modes-3/support/adobe-fonts/LICENSE to css-writing-modes-3/support/adobe-fonts/LICENSE
Importing css-writing-modes-3/support/adobe-fonts/README.md to css-writing-modes-3/support/adobe-fonts/README.md
-Importing css21/reference/ref-filled-green-100px-square.xht to css21/reference/ref-filled-green-100px-square.xht
+Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-005.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-005.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-009.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-009.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-013.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-013.xht
Importing css-writing-modes-3/abs-pos-non-replaced-icb-vlr-015.xht to css-writing-modes-3/abs-pos-non-replaced-icb-vlr-015.xht
@@ -1212,16 +1230,32 @@ Importing css-writing-modes-3/float-cont
Importing css-writing-modes-3/float-contiguous-vrl-002.xht to css-writing-modes-3/float-contiguous-vrl-002.xht
Importing css-writing-modes-3/float-contiguous-vrl-004.xht to css-writing-modes-3/float-contiguous-vrl-004.xht
Importing css-writing-modes-3/float-contiguous-vrl-006.xht to css-writing-modes-3/float-contiguous-vrl-006.xht
Importing css-writing-modes-3/float-contiguous-vrl-006-ref.xht to css-writing-modes-3/float-contiguous-vrl-006-ref.xht
Importing css-writing-modes-3/float-contiguous-vrl-008.xht to css-writing-modes-3/float-contiguous-vrl-008.xht
Importing css-writing-modes-3/float-contiguous-vrl-008-ref.xht to css-writing-modes-3/float-contiguous-vrl-008-ref.xht
Importing css-writing-modes-3/float-contiguous-vrl-010.xht to css-writing-modes-3/float-contiguous-vrl-010.xht
Importing css-writing-modes-3/float-contiguous-vrl-012.xht to css-writing-modes-3/float-contiguous-vrl-012.xht
+Importing css-writing-modes-3/float-lft-orthog-htb-in-vlr-002.xht to css-writing-modes-3/float-lft-orthog-htb-in-vlr-002.xht
+Importing css-writing-modes-3/float-lft-orthog-htb-in-vlr-002-ref.xht to css-writing-modes-3/float-lft-orthog-htb-in-vlr-002-ref.xht
+Importing css-writing-modes-3/float-lft-orthog-htb-in-vrl-002.xht to css-writing-modes-3/float-lft-orthog-htb-in-vrl-002.xht
+Importing css-writing-modes-3/float-lft-orthog-htb-in-vrl-002-ref.xht to css-writing-modes-3/float-lft-orthog-htb-in-vrl-002-ref.xht
+Importing css-writing-modes-3/float-lft-orthog-vlr-in-htb-002.xht to css-writing-modes-3/float-lft-orthog-vlr-in-htb-002.xht
+Importing css-writing-modes-3/float-lft-orthog-vlr-in-htb-002-ref.xht to css-writing-modes-3/float-lft-orthog-vlr-in-htb-002-ref.xht
+Importing css-writing-modes-3/float-lft-orthog-vrl-in-htb-002.xht to css-writing-modes-3/float-lft-orthog-vrl-in-htb-002.xht
+Importing css-writing-modes-3/float-lft-orthog-vrl-in-htb-002-ref.xht to css-writing-modes-3/float-lft-orthog-vrl-in-htb-002-ref.xht
+Importing css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003.xht to css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003.xht
+Importing css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003-ref.xht to css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003-ref.xht
+Importing css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003.xht to css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003.xht
+Importing css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003-ref.xht to css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003-ref.xht
+Importing css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003.xht to css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003.xht
+Importing css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003-ref.xht to css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003-ref.xht
+Importing css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003.xht to css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003.xht
+Importing css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003-ref.xht to css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003-ref.xht
Importing css-writing-modes-3/float-shrink-to-fit-vlr-003.xht to css-writing-modes-3/float-shrink-to-fit-vlr-003.xht
Importing css-writing-modes-3/float-shrink-to-fit-vlr-005.xht to css-writing-modes-3/float-shrink-to-fit-vlr-005.xht
Importing css-writing-modes-3/float-shrink-to-fit-vlr-007.xht to css-writing-modes-3/float-shrink-to-fit-vlr-007.xht
Importing css-writing-modes-3/float-shrink-to-fit-vlr-009.xht to css-writing-modes-3/float-shrink-to-fit-vlr-009.xht
Importing css-writing-modes-3/float-shrink-to-fit-vrl-002.xht to css-writing-modes-3/float-shrink-to-fit-vrl-002.xht
Importing css-writing-modes-3/float-shrink-to-fit-vrl-004.xht to css-writing-modes-3/float-shrink-to-fit-vrl-004.xht
Importing css-writing-modes-3/float-shrink-to-fit-vrl-006.xht to css-writing-modes-3/float-shrink-to-fit-vrl-006.xht
Importing css-writing-modes-3/float-shrink-to-fit-vrl-008.xht to css-writing-modes-3/float-shrink-to-fit-vrl-008.xht
@@ -1356,30 +1390,50 @@ Importing css-writing-modes-3/margin-col
Importing css-writing-modes-3/margin-collapse-vrl-014.xht to css-writing-modes-3/margin-collapse-vrl-014.xht
Importing css-writing-modes-3/margin-collapse-vrl-016.xht to css-writing-modes-3/margin-collapse-vrl-016.xht
Importing css-writing-modes-3/margin-collapse-vrl-024.xht to css-writing-modes-3/margin-collapse-vrl-024.xht
Importing css-writing-modes-3/margin-collapse-vrl-030.xht to css-writing-modes-3/margin-collapse-vrl-030.xht
Importing css-writing-modes-3/margin-collapse-vrl-034.xht to css-writing-modes-3/margin-collapse-vrl-034.xht
Importing css-writing-modes-3/margin-collapse-vrl-036.xht to css-writing-modes-3/margin-collapse-vrl-036.xht
Importing css-writing-modes-3/margin-vlr-003.xht to css-writing-modes-3/margin-vlr-003.xht
Importing css-writing-modes-3/margin-vrl-002.xht to css-writing-modes-3/margin-vrl-002.xht
+Importing css-writing-modes-3/normal-flow-overconstrained-vlr-003.xht to css-writing-modes-3/normal-flow-overconstrained-vlr-003.xht
+Importing css-writing-modes-3/normal-flow-overconstrained-vlr-005.xht to css-writing-modes-3/normal-flow-overconstrained-vlr-005.xht
+Importing css-writing-modes-3/normal-flow-overconstrained-vrl-002.xht to css-writing-modes-3/normal-flow-overconstrained-vrl-002.xht
+Importing css-writing-modes-3/normal-flow-overconstrained-vrl-004.xht to css-writing-modes-3/normal-flow-overconstrained-vrl-004.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-002.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-002.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-002-ref.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-002-ref.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-006.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-006.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-006-ref.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-006-ref.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-010.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-010.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-010-ref.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-010-ref.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-014.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-014.xht
Importing css-writing-modes-3/ortho-htb-alongside-vrl-floats-014-ref.xht to css-writing-modes-3/ortho-htb-alongside-vrl-floats-014-ref.xht
Importing css-writing-modes-3/outline-inline-block-vrl-006.html to css-writing-modes-3/outline-inline-block-vrl-006.html
Importing css-writing-modes-3/reference/outline-inline-block-vrl-006.html to css-writing-modes-3/reference/outline-inline-block-vrl-006.html
Importing css-writing-modes-3/outline-inline-vlr-006.html to css-writing-modes-3/outline-inline-vlr-006.html
Importing css-writing-modes-3/reference/outline-inline-vlr-006.html to css-writing-modes-3/reference/outline-inline-vlr-006.html
Importing css-writing-modes-3/outline-inline-vrl-006.html to css-writing-modes-3/outline-inline-vrl-006.html
Importing css-writing-modes-3/reference/outline-inline-vrl-006.html to css-writing-modes-3/reference/outline-inline-vrl-006.html
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005-ref.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004-ref.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003-ref.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002-ref.xht to css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009-ref.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008-ref.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007-ref.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007-ref.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006.xht
+Importing css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006-ref.xht to css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006-ref.xht
Importing css-writing-modes-3/padding-vlr-005.xht to css-writing-modes-3/padding-vlr-005.xht
Importing css-writing-modes-3/padding-vrl-004.xht to css-writing-modes-3/padding-vrl-004.xht
Importing css-writing-modes-3/percent-margin-vlr-003.xht to css-writing-modes-3/percent-margin-vlr-003.xht
Importing css-writing-modes-3/percent-margin-vlr-005.xht to css-writing-modes-3/percent-margin-vlr-005.xht
Importing css-writing-modes-3/percent-margin-vlr-007.xht to css-writing-modes-3/percent-margin-vlr-007.xht
Importing css-writing-modes-3/percent-margin-vrl-002.xht to css-writing-modes-3/percent-margin-vrl-002.xht
Importing css-writing-modes-3/percent-margin-vrl-004.xht to css-writing-modes-3/percent-margin-vrl-004.xht
Importing css-writing-modes-3/percent-margin-vrl-006.xht to css-writing-modes-3/percent-margin-vrl-006.xht
@@ -1396,16 +1450,226 @@ Importing css-writing-modes-3/row-progre
Importing css-writing-modes-3/row-progression-vlr-003.xht to css-writing-modes-3/row-progression-vlr-003.xht
Importing css-writing-modes-3/row-progression-vlr-005.xht to css-writing-modes-3/row-progression-vlr-005.xht
Importing css-writing-modes-3/row-progression-vlr-007.xht to css-writing-modes-3/row-progression-vlr-007.xht
Importing css-writing-modes-3/row-progression-vlr-009.xht to css-writing-modes-3/row-progression-vlr-009.xht
Importing css-writing-modes-3/row-progression-vrl-002.xht to css-writing-modes-3/row-progression-vrl-002.xht
Importing css-writing-modes-3/row-progression-vrl-004.xht to css-writing-modes-3/row-progression-vrl-004.xht
Importing css-writing-modes-3/row-progression-vrl-006.xht to css-writing-modes-3/row-progression-vrl-006.xht
Importing css-writing-modes-3/row-progression-vrl-008.xht to css-writing-modes-3/row-progression-vrl-008.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-001.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-001.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-001-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-003.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-003.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-003-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-004.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-004.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-004-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-006.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-006.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-006-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-007.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-007.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-007-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-008.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-008.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-008-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-009.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-009.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-010.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-010.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-010-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-010-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-011.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-011.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-011-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-011-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-012.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-012.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-013.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-013.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-013-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-013-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-015.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-015.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-015-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-015-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-016.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-016.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-016-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-016-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-018.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-018.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-018-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-018-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-019.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-019.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-019-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-019-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-020.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-020.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-020-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-020-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-021.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-021.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-022.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-022.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-022-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-022-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-023.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-023.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-023-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-023-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vlr-024.xht to css-writing-modes-3/sizing-orthog-htb-in-vlr-024.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-001.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-001.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-001-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-003.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-003.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-003-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-004.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-004.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-006.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-006.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-006-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-007.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-007.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-007-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-008.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-008.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-008-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-009.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-009.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-010.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-010.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-010-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-010-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-011.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-011.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-011-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-011-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-012.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-012.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-013.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-013.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-013-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-013-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-015.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-015.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-015-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-015-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-016.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-016.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-018.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-018.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-018-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-018-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-019.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-019.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-019-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-019-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-020.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-020.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-020-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-020-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-021.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-021.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-022.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-022.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-022-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-022-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-023.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-023.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-023-ref.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-023-ref.xht
+Importing css-writing-modes-3/sizing-orthog-htb-in-vrl-024.xht to css-writing-modes-3/sizing-orthog-htb-in-vrl-024.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008.xht
+Importing css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008-ref.xht to css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008-ref.xht to css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008.xht
+Importing css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008-ref.xht to css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-001.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-001.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-001-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-003.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-003.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-003-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-004.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-004.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-004-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-006.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-006.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-006-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-007.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-007.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-007-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-008.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-008.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-008-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-009.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-009.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-009-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-009-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-010.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-010.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-010-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-010-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-011.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-011.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-011-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-011-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-012.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-012.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-012-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-012-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-013.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-013.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-013-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-013-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-015.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-015.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-015-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-015-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-016.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-016.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-016-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-016-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-018.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-018.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-018-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-018-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-019.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-019.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-019-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-019-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-020.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-020.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-020-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-020-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-021.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-021.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-022.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-022.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-022-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-022-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-023.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-023.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-023-ref.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-023-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vlr-in-htb-024.xht to css-writing-modes-3/sizing-orthog-vlr-in-htb-024.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-001.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-001.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-001-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-001-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-003.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-003.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-003-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-003-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-004.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-004.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-004-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-004-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-006.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-006.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-006-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-006-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-007.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-007.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-007-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-007-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-008.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-008.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-008-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-008-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-009.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-009.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-009-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-009-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-010.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-010.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-010-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-010-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-011.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-011.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-011-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-011-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-012.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-012.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-012-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-012-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-013.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-013.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-013-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-013-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-015.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-015.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-015-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-015-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-016.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-016.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-016-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-016-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-018.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-018.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-018-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-018-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-019.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-019.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-019-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-019-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-020.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-020.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-020-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-020-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-021.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-021.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-022.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-022.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-022-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-022-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-023.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-023.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-023-ref.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-023-ref.xht
+Importing css-writing-modes-3/sizing-orthog-vrl-in-htb-024.xht to css-writing-modes-3/sizing-orthog-vrl-in-htb-024.xht
Importing css-writing-modes-3/table-column-order-002.xht to css-writing-modes-3/table-column-order-002.xht
Importing css-writing-modes-3/table-column-order-003.xht to css-writing-modes-3/table-column-order-003.xht
Importing css-writing-modes-3/table-column-order-004.xht to css-writing-modes-3/table-column-order-004.xht
Importing css-writing-modes-3/table-column-order-005.xht to css-writing-modes-3/table-column-order-005.xht
Importing css-writing-modes-3/table-column-order-slr-007.xht to css-writing-modes-3/table-column-order-slr-007.xht
Importing css-writing-modes-3/table-column-order-srl-006.xht to css-writing-modes-3/table-column-order-srl-006.xht
Importing css-writing-modes-3/table-progression-slr-001.html to css-writing-modes-3/table-progression-slr-001.html
Importing css-writing-modes-3/table-progression-slr-001-ref.html to css-writing-modes-3/table-progression-slr-001-ref.html
@@ -1571,28 +1835,34 @@ Importing css-writing-modes-3/reference/
Importing css-writing-modes-3/writing-mode-vertical-lr-002.xht to css-writing-modes-3/writing-mode-vertical-lr-002.xht
Importing css-writing-modes-3/reftest/writing-mode-vertical-lr-002-ref.xht to css-writing-modes-3/reftest/writing-mode-vertical-lr-002-ref.xht
Importing css-writing-modes-3/writing-mode-vertical-rl-001.xht to css-writing-modes-3/writing-mode-vertical-rl-001.xht
Importing css-writing-modes-3/reftest/writing-mode-vertical-rl-001-ref.xht to css-writing-modes-3/reftest/writing-mode-vertical-rl-001-ref.xht
Importing css-writing-modes-3/writing-mode-vertical-rl-002.xht to css-writing-modes-3/writing-mode-vertical-rl-002.xht
Importing css-writing-modes-3/reftest/writing-mode-vertical-rl-002-ref.xht to css-writing-modes-3/reftest/writing-mode-vertical-rl-002-ref.xht
Importing css-writing-modes-3/writing-mode-vertical-rl-003.htm to css-writing-modes-3/writing-mode-vertical-rl-003.htm
Importing css-writing-modes-3/writing-mode-vertical-rl-003-ref.htm to css-writing-modes-3/writing-mode-vertical-rl-003-ref.htm
-Importing selectors-4/focus-within-001.html to selectors-4/focus-within-001.html
-Importing selectors-4/focus-within-001-ref.html to selectors-4/focus-within-001-ref.html
-Importing selectors-4/focus-within-002.html to selectors-4/focus-within-002.html
-Importing selectors-4/focus-within-003.html to selectors-4/focus-within-003.html
-Importing selectors-4/focus-within-004.html to selectors-4/focus-within-004.html
-Importing selectors-4/focus-within-005.html to selectors-4/focus-within-005.html
-Importing selectors-4/focus-within-006.html to selectors-4/focus-within-006.html
-Importing selectors-4/focus-within-shadow-001.html to selectors-4/focus-within-shadow-001.html
-Importing selectors-4/focus-within-shadow-001-ref.html to selectors-4/focus-within-shadow-001-ref.html
-Importing selectors-4/focus-within-shadow-002.html to selectors-4/focus-within-shadow-002.html
-Importing selectors-4/focus-within-shadow-003.html to selectors-4/focus-within-shadow-003.html
-Importing selectors-4/focus-within-shadow-004.html to selectors-4/focus-within-shadow-004.html
-Importing selectors-4/focus-within-shadow-005.html to selectors-4/focus-within-shadow-005.html
-Importing selectors-4/of-type-selectors.xhtml to selectors-4/of-type-selectors.xhtml
-Importing selectors-4/of-type-selectors-ref.xhtml to selectors-4/of-type-selectors-ref.xhtml
-Importing selectors-4/selector-required.html to selectors-4/selector-required.html
-Importing selectors-4/selector-required-ref.html to selectors-4/selector-required-ref.html
-Importing selectors-4/selectors-dir-selector-ltr-001.html to selectors-4/selectors-dir-selector-ltr-001.html
-Importing selectors-4/selectors-dir-selector-ref.html to selectors-4/selectors-dir-selector-ref.html
-Importing selectors-4/selectors-dir-selector-rtl-001.html to selectors-4/selectors-dir-selector-rtl-001.html
+Importing selectors4/OWNERS to selectors4/OWNERS
+Importing selectors4/focus-within-001.html to selectors4/focus-within-001.html
+Importing selectors4/focus-within-001-ref.html to selectors4/focus-within-001-ref.html
+Importing selectors4/focus-within-002.html to selectors4/focus-within-002.html
+Importing selectors4/focus-within-003.html to selectors4/focus-within-003.html
+Importing selectors4/focus-within-004.html to selectors4/focus-within-004.html
+Importing selectors4/focus-within-005.html to selectors4/focus-within-005.html
+Importing selectors4/focus-within-006.html to selectors4/focus-within-006.html
+Importing selectors4/focus-within-006-ref.html to selectors4/focus-within-006-ref.html
+Importing selectors4/focus-within-007.html to selectors4/focus-within-007.html
+Importing selectors4/focus-within-007-ref.html to selectors4/focus-within-007-ref.html
+Importing selectors4/focus-within-008.html to selectors4/focus-within-008.html
+Importing selectors4/focus-within-010.html to selectors4/focus-within-010.html
+Importing selectors4/focus-within-shadow-001-ref.html to selectors4/focus-within-shadow-001-ref.html
+Importing selectors4/focus-within-shadow-001.html to selectors4/focus-within-shadow-001.html
+Importing selectors4/focus-within-shadow-002.html to selectors4/focus-within-shadow-002.html
+Importing selectors4/focus-within-shadow-003.html to selectors4/focus-within-shadow-003.html
+Importing selectors4/focus-within-shadow-004.html to selectors4/focus-within-shadow-004.html
+Importing selectors4/focus-within-shadow-005.html to selectors4/focus-within-shadow-005.html
+Importing selectors4/focus-within-shadow-006.html to selectors4/focus-within-shadow-006.html
+Importing selectors4/of-type-selectors.xhtml to selectors4/of-type-selectors.xhtml
+Importing selectors4/of-type-selectors-ref.xhtml to selectors4/of-type-selectors-ref.xhtml
+Importing selectors4/selector-required.html to selectors4/selector-required.html
+Importing selectors4/selector-required-ref.html to selectors4/selector-required-ref.html
+Importing selectors4/selectors-dir-selector-ltr-001.html to selectors4/selectors-dir-selector-ltr-001.html
+Importing selectors4/selectors-dir-selector-rtl-001.html to selectors4/selectors-dir-selector-rtl-001.html
--- a/layout/reftests/w3c-css/received/reftest.list
+++ b/layout/reftests/w3c-css/received/reftest.list
@@ -40,35 +40,39 @@
== css-conditional-3/at-supports-036.html css-conditional-3/at-supports-001-ref.html
== css-conditional-3/at-supports-037.html css-conditional-3/at-supports-001-ref.html
== css-conditional-3/at-supports-038.html css-conditional-3/at-supports-001-ref.html
== css-conditional-3/at-supports-039.html css-conditional-3/at-supports-001-ref.html
== css-multicol-1/multicol-basic-001.html css-multicol-1/reference/multicol-basic-ref.html
== css-multicol-1/multicol-basic-002.html css-multicol-1/reference/multicol-basic-ref.html
== css-multicol-1/multicol-basic-003.html css-multicol-1/reference/multicol-basic-ref.html
== css-multicol-1/multicol-basic-004.html css-multicol-1/reference/multicol-basic-ref.html
+== css-multicol-1/multicol-basic-005.xht css-multicol-1/reference/multicol-basic-005-ref.xht
+== css-multicol-1/multicol-basic-006.xht css-multicol-1/reference/multicol-basic-005-ref.xht
+== css-multicol-1/multicol-basic-007.xht css-multicol-1/reference/multicol-basic-005-ref.xht
+== css-multicol-1/multicol-basic-008.xht css-multicol-1/reference/multicol-basic-005-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-block-clip-001.xht css-multicol-1/multicol-block-clip-001-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-block-clip-002.xht css-multicol-1/multicol-block-clip-002-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-br-inside-avoidcolumn-001.xht css-multicol-1/multicol-br-inside-avoidcolumn-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-break-000.xht css-multicol-1/multicol-break-000-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-break-001.xht css-multicol-1/multicol-break-001-ref.xht
-fuzzy(135,1008) == css-multicol-1/multicol-clip-001.xht css-multicol-1/multicol-clip-001-ref.xht
-fuzzy(135,702) == css-multicol-1/multicol-clip-002.xht css-multicol-1/multicol-clip-002-ref.xht
-fuzzy(135,467) == css-multicol-1/multicol-collapsing-001.xht css-multicol-1/multicol-collapsing-001-ref.xht
+fuzzy(116,1008) == css-multicol-1/multicol-clip-001.xht css-multicol-1/multicol-clip-001-ref.xht
+fuzzy(116,702) == css-multicol-1/multicol-clip-002.xht css-multicol-1/multicol-clip-002-ref.xht
+fuzzy(116,467) == css-multicol-1/multicol-collapsing-001.xht css-multicol-1/multicol-collapsing-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-001.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-002.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-003.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-004.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-005.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-006.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-columns-007.xht css-multicol-1/multicol-columns-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-columns-invalid-001.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fails-if(OSX||winWidget) == css-multicol-1/multicol-columns-invalid-002.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-columns-toolong-001.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
-fuzzy(135,530) == css-multicol-1/multicol-containing-001.xht css-multicol-1/multicol-containing-001-ref.xht
+fuzzy(116,530) == css-multicol-1/multicol-containing-001.xht css-multicol-1/multicol-containing-001-ref.xht
fuzzy(215,241) == css-multicol-1/multicol-containing-002.xht css-multicol-1/multicol-containing-002-ref.xht
fuzzy(87,180) == css-multicol-1/multicol-count-001.xht css-multicol-1/multicol-columns-001-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-count-002.xht css-multicol-1/multicol-count-002-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-count-computed-001.xht css-multicol-1/multicol-count-computed-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-count-computed-002.xht css-multicol-1/multicol-count-computed-2-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-count-computed-003.xht css-multicol-1/multicol-count-computed-003-ref.xht
fuzzy-if(winWidget||OSX||gtkWidget,112,861) fails-if(Android) == css-multicol-1/multicol-count-computed-004.xht css-multicol-1/multicol-count-computed-004-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-count-computed-005.xht css-multicol-1/multicol-count-computed-003-ref.xht
@@ -77,53 +81,53 @@ fuzzy(255,132) == css-multicol-1/multico
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-count-negative-001.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-count-negative-002.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-count-non-integer-001.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-count-non-integer-002.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-count-non-integer-003.xht css-multicol-1/multicol-columns-invalid-001-ref.xht
== css-multicol-1/multicol-fill-000.xht css-multicol-1/multicol-fill-000-ref.xht
== css-multicol-1/multicol-fill-001.xht css-multicol-1/multicol-fill-001-ref.xht
== css-multicol-1/multicol-fill-auto-001.xht css-multicol-1/multicol-fill-auto-001-ref.xht
-fuzzy(135,80) == css-multicol-1/multicol-fill-auto-002.xht css-multicol-1/multicol-fill-auto-002-ref.xht
-fuzzy(135,3270) == css-multicol-1/multicol-fill-auto-003.xht css-multicol-1/multicol-fill-auto-003-ref.xht
+fuzzy(116,80) == css-multicol-1/multicol-fill-auto-002.xht css-multicol-1/multicol-fill-auto-002-ref.xht
+fuzzy(116,3270) == css-multicol-1/multicol-fill-auto-003.xht css-multicol-1/multicol-fill-auto-003-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-fill-auto-block-children-001.xht css-multicol-1/multicol-fill-auto-block-children-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-fill-auto-block-children-002.xht css-multicol-1/multicol-fill-auto-block-children-002-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-fill-auto.xht css-multicol-1/multicol-fill-ref.xht
-fuzzy(135,80) == css-multicol-1/multicol-fill-balance-001.xht css-multicol-1/multicol-fill-balance-001-ref.xht
-fuzzy(135,821) == css-multicol-1/multicol-gap-000.xht css-multicol-1/multicol-gap-000-ref.xht
+fuzzy(116,80) == css-multicol-1/multicol-fill-balance-001.xht css-multicol-1/multicol-fill-balance-001-ref.xht
+fuzzy(116,821) == css-multicol-1/multicol-gap-000.xht css-multicol-1/multicol-gap-000-ref.xht
fuzzy(255,290) == css-multicol-1/multicol-gap-001.xht css-multicol-1/multicol-gap-001-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-gap-002.xht css-multicol-1/multicol-gap-002-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-gap-003.xht css-multicol-1/multicol-gap-002-ref.xht
fuzzy(107,1823) == css-multicol-1/multicol-gap-fraction-001.xht css-multicol-1/multicol-gap-fraction-001-ref.xht
fuzzy-if(winWidget||OSX||gtkWidget,204,1048) fuzzy-if(skiaContent,208,1048) fails-if(Android) == css-multicol-1/multicol-gap-large-001.xht css-multicol-1/multicol-gap-large-001-ref.xht
fuzzy(225,920) == css-multicol-1/multicol-gap-large-002.xht css-multicol-1/multicol-gap-large-002-ref.xht
fuzzy(204,930) fuzzy-if(skiaContent,208,930) == css-multicol-1/multicol-gap-negative-001.xht css-multicol-1/multicol-gap-002-ref.xht
== css-multicol-1/multicol-height-001.xht css-multicol-1/multicol-height-001-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-height-block-child-001.xht css-multicol-1/multicol-height-block-child-001-ref.xht
fuzzy(255,3762) == css-multicol-1/multicol-inherit-001.xht css-multicol-1/multicol-inherit-001-ref.xht
-fuzzy(135,1893) == css-multicol-1/multicol-inherit-002.xht css-multicol-1/multicol-inherit-002-ref.xht
+fuzzy(116,1893) == css-multicol-1/multicol-inherit-002.xht css-multicol-1/multicol-inherit-002-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-inherit-003.xht css-multicol-1/multicol-inherit-3-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-inherit-004.xht css-multicol-1/multicol-inherit-4-ref.xht
fuzzy(96,264) == css-multicol-1/multicol-list-item-001.xht css-multicol-1/multicol-list-item-001-ref.xht
fuzzy(73,1200) == css-multicol-1/multicol-margin-001.xht reference/ref-filled-green-100px-square.xht
fuzzy(73,1200) == css-multicol-1/multicol-margin-002.xht reference/ref-filled-green-100px-square.xht
fuzzy(243,3322) fuzzy-if(skiaContent,244,3322) == css-multicol-1/multicol-margin-child-001.xht css-multicol-1/multicol-margin-child-001-ref.xht
fuzzy(255,4008) == css-multicol-1/multicol-nested-002.xht css-multicol-1/multicol-nested-002-ref.xht
-fuzzy(255,4109) == css-multicol-1/multicol-nested-005.xht css-multicol-1/multicol-nested-005-ref.xht
+fuzzy(255,4109) fails-if(stylo) == css-multicol-1/multicol-nested-005.xht css-multicol-1/multicol-nested-005-ref.xht
fuzzy(225,13600) == css-multicol-1/multicol-nested-column-rule-001.xht css-multicol-1/multicol-nested-column-rule-001-ref.xht
fuzzy(204,2463) fuzzy-if(skiaContent,208,2463) == css-multicol-1/multicol-nested-margin-001.xht css-multicol-1/multicol-nested-margin-001-ref.xht
-fails-if(OSX||winWidget) == css-multicol-1/multicol-nested-margin-002.xht css-multicol-1/multicol-nested-margin-002-ref.xht
-fuzzy(204,2371) fuzzy-if(skiaContent,208,2371) == css-multicol-1/multicol-nested-margin-003.xht css-multicol-1/multicol-nested-margin-003-ref.xht
-fuzzy(225,2529) == css-multicol-1/multicol-nested-margin-004.xht css-multicol-1/multicol-nested-margin-004-ref.xht
-fuzzy(225,2529) == css-multicol-1/multicol-nested-margin-005.xht css-multicol-1/multicol-nested-margin-004-ref.xht
-fuzzy(135,142) == css-multicol-1/multicol-overflow-000.xht css-multicol-1/multicol-overflow-000-ref.xht
+fails-if(OSX||winWidget||stylo) == css-multicol-1/multicol-nested-margin-002.xht css-multicol-1/multicol-nested-margin-002-ref.xht
+fuzzy(204,2371) fuzzy-if(skiaContent,208,2371) fails-if(stylo) == css-multicol-1/multicol-nested-margin-003.xht css-multicol-1/multicol-nested-margin-003-ref.xht
+fuzzy(225,2529) fails-if(stylo) == css-multicol-1/multicol-nested-margin-004.xht css-multicol-1/multicol-nested-margin-004-ref.xht
+fuzzy(225,2529) fails-if(stylo) == css-multicol-1/multicol-nested-margin-005.xht css-multicol-1/multicol-nested-margin-004-ref.xht
+fuzzy(116,142) == css-multicol-1/multicol-overflow-000.xht css-multicol-1/multicol-overflow-000-ref.xht
fuzzy(204,1844) fuzzy-if(skiaContent,208,1844) == css-multicol-1/multicol-overflowing-001.xht css-multicol-1/multicol-overflowing-001-ref.xht
fuzzy-if(OSX,61,2) fuzzy-if(skiaContent,64,2) == css-multicol-1/multicol-reduce-000.xht css-multicol-1/multicol-reduce-000-ref.xht
fuzzy-if(OSX,8,20) == css-multicol-1/multicol-rule-000.xht css-multicol-1/multicol-rule-000-ref.xht
-fuzzy(135,1584) == css-multicol-1/multicol-rule-001.xht css-multicol-1/multicol-rule-001-ref.xht
+fuzzy(116,1584) == css-multicol-1/multicol-rule-001.xht css-multicol-1/multicol-rule-001-ref.xht
fails-if(!stylo) == css-multicol-1/multicol-rule-002.xht css-multicol-1/multicol-rule-ref.xht
fails-if(OSX||winWidget) == css-multicol-1/multicol-rule-003.xht css-multicol-1/multicol-rule-003-ref.xht
== css-multicol-1/multicol-rule-004.xht css-multicol-1/multicol-rule-004-ref.xht
fails-if(OSX||winWidget) == css-multicol-1/multicol-rule-color-001.xht css-multicol-1/multicol-rule-color-001-ref.xht
== css-multicol-1/multicol-rule-color-inherit-001.xht css-multicol-1/multicol-rule-color-inherit-001-ref.xht
== css-multicol-1/multicol-rule-color-inherit-002.xht css-multicol-1/multicol-rule-color-inherit-001-ref.xht
fuzzy(106,354) == css-multicol-1/multicol-rule-dashed-000.xht css-multicol-1/multicol-rule-dashed-000-ref.xht
fuzzy(106,354) == css-multicol-1/multicol-rule-dotted-000.xht css-multicol-1/multicol-rule-dotted-000-ref.xht
@@ -214,63 +218,66 @@ fails-if(!stylo) == css-values-3/attr-le
== css-values-3/attr-length-invalid-fallback.html css-values-3/reference/200-200-green.html
fails-if(!stylo) == css-values-3/attr-length-valid-zero-nofallback.html css-values-3/reference/200-200-green.html
fails-if(!stylo) == css-values-3/attr-length-valid-zero.html css-values-3/reference/200-200-green.html
fails-if(!stylo) == css-values-3/attr-length-valid.html css-values-3/reference/200-200-green.html
fails-if(!stylo) == css-values-3/attr-px-invalid-cast.html css-values-3/reference/200-200-green.html
== css-values-3/attr-px-invalid-fallback.html css-values-3/reference/200-200-green.html
fails-if(!stylo) == css-values-3/attr-px-valid.html css-values-3/reference/200-200-green.html
== css-values-3/calc-in-calc.html css-values-3/reference/all-green.html
-fails == css-values-3/calc-in-media-queries-001.html css-values-3/reference/all-green.html
-fails == css-values-3/calc-in-media-queries-002.html css-values-3/reference/all-green.html
+fails-if(!stylo) == css-values-3/calc-in-media-queries-001.html css-values-3/reference/all-green.html
+fails-if(!stylo) == css-values-3/calc-in-media-queries-002.html css-values-3/reference/all-green.html
== css-values-3/calc-invalid-range-clamping.html css-values-3/reference/200-200-green.html
== css-values-3/calc-parenthesis-stack.html css-values-3/reference/all-green.html
fuzzy-if(OSX,40,6) == css-values-3/ch-unit-001.html css-values-3/reference/ch-unit-001-ref.html
+== css-values-3/ch-unit-002.html css-values-3/reference/ch-unit-002-ref.html
+== css-values-3/ch-unit-003.html css-values-3/reference/ch-unit-001-ref.html
+== css-values-3/ch-unit-004.html css-values-3/reference/ch-unit-001-ref.html
== css-values-3/initial-background-color.html css-values-3/reference/all-green.html
== css-values-3/vh-calc-support-pct.html css-values-3/reference/all-green.html
== css-values-3/vh-calc-support.html css-values-3/reference/all-green.html
== css-values-3/vh-em-inherit.html css-values-3/reference/all-green.html
== css-values-3/vh-inherit.html css-values-3/reference/all-green.html
== css-values-3/vh-interpolate-pct.html css-values-3/reference/all-green.html
== css-values-3/vh-interpolate-px.html css-values-3/reference/all-green.html
== css-values-3/vh-interpolate-vh.html css-values-3/reference/all-green.html
fails-if(stylo) == css-values-3/vh-support-atviewport.html css-values-3/reference/all-green.html
== css-values-3/vh-support-margin.html css-values-3/reference/all-green.html
skip == css-values-3/vh-support-transform-origin.html css-values-3/reference/all-green.html
skip == css-values-3/vh-support-transform-translate.html css-values-3/reference/all-green.html
== css-values-3/vh-support.html css-values-3/reference/all-green.html
== css-values-3/vh-zero-support.html css-values-3/reference/all-green.html
skip == css-values-3/vh_not_refreshing_on_chrome.html css-values-3/reference/vh_not_refreshing_on_chrome-ref.html
skip == css-values-3/vh_not_refreshing_on_chrome_iframe.html css-values-3/reference/vh_not_refreshing_on_chrome-ref.html
-== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-003.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-005.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-007.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-009.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-011.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-013.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-015.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-017.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-019.xht css21/reference/ref-filled-green-100px-square.xht
-skip == css-writing-modes-3/abs-pos-non-replaced-icb-vlr-021.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-019.xht reference/ref-filled-green-100px-square.xht
+skip == css-writing-modes-3/abs-pos-non-replaced-icb-vlr-021.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-023.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-025.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-027.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-029.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-031.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vlr-033.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-002.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-006.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-010.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-010.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-012.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-004-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-014.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-016.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
-== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-018.xht css21/reference/ref-filled-green-100px-square.xht
-skip == css-writing-modes-3/abs-pos-non-replaced-icb-vrl-020.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-018.xht reference/ref-filled-green-100px-square.xht
+skip == css-writing-modes-3/abs-pos-non-replaced-icb-vrl-020.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-022.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-024.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-026.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-028.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-030.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/abs-pos-non-replaced-icb-vrl-032.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
fuzzy-if(OSX||winWidget,255,480) == css-writing-modes-3/abs-pos-non-replaced-vlr-003.xht css-writing-modes-3/abs-pos-non-replaced-vlr-003-ref.xht
fuzzy-if(OSX||winWidget,255,480) == css-writing-modes-3/abs-pos-non-replaced-vlr-005.xht css-writing-modes-3/abs-pos-non-replaced-vrl-004-ref.xht
@@ -498,20 +505,20 @@ fuzzy-if(OSX||winWidget,255,480) == css-
fuzzy-if(OSX||winWidget,255,480) == css-writing-modes-3/abs-pos-non-replaced-vrl-228.xht css-writing-modes-3/abs-pos-non-replaced-vlr-009-ref.xht
== css-writing-modes-3/background-position-vrl-018.xht css-writing-modes-3/background-position-vrl-018-ref.xht
== css-writing-modes-3/background-position-vrl-020.xht css-writing-modes-3/background-position-vrl-018-ref.xht
== css-writing-modes-3/background-position-vrl-022.xht css-writing-modes-3/background-position-vrl-018-ref.xht
== css-writing-modes-3/background-size-document-root-vrl-002.html css-writing-modes-3/background-size-document-root-vrl-002-ref.xht
== css-writing-modes-3/background-size-document-root-vrl-004.html css-writing-modes-3/background-size-document-root-vrl-002-ref.xht
== css-writing-modes-3/background-size-document-root-vrl-006.html css-writing-modes-3/background-size-document-root-vrl-002-ref.xht
== css-writing-modes-3/background-size-document-root-vrl-008.html css-writing-modes-3/background-size-document-root-vrl-002-ref.xht
-fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-002.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-003.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-004.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-005.xht css21/reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-002.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-003.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-004.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,600) == css-writing-modes-3/baseline-inline-non-replaced-005.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/baseline-inline-replaced-002.xht css-writing-modes-3/baseline-inline-replaced-002-ref.xht
== css-writing-modes-3/baseline-inline-replaced-003.xht css-writing-modes-3/baseline-inline-replaced-002-ref.xht
== css-writing-modes-3/bidi-embed-001.html css-writing-modes-3/reference/bidi-embed-001.html
== css-writing-modes-3/bidi-embed-002.html css-writing-modes-3/reference/bidi-embed-002.html
== css-writing-modes-3/bidi-embed-003.html css-writing-modes-3/reference/bidi-embed-003.html
== css-writing-modes-3/bidi-embed-004.html css-writing-modes-3/reference/bidi-embed-004.html
== css-writing-modes-3/bidi-embed-005.html css-writing-modes-3/reference/bidi-embed-005.html
== css-writing-modes-3/bidi-embed-006.html css-writing-modes-3/reference/bidi-embed-006.html
@@ -647,42 +654,42 @@ fuzzy-if(OSX||winWidget,213,1540) == css
== css-writing-modes-3/block-override-isolate-001.html css-writing-modes-3/reference/block-override-isolate-001.html
== css-writing-modes-3/block-override-isolate-002.html css-writing-modes-3/reference/block-override-isolate-002.html
== css-writing-modes-3/block-override-isolate-003.html css-writing-modes-3/reference/block-override-isolate-003.html
== css-writing-modes-3/block-override-isolate-004.html css-writing-modes-3/reference/block-override-isolate-004.html
== css-writing-modes-3/block-plaintext-001.html css-writing-modes-3/reference/block-plaintext-001.html
== css-writing-modes-3/block-plaintext-002.html css-writing-modes-3/reference/block-plaintext-002.html
== css-writing-modes-3/block-plaintext-003.html css-writing-modes-3/reference/block-plaintext-003.html
== css-writing-modes-3/block-plaintext-004.html css-writing-modes-3/reference/block-plaintext-004.html
-== css-writing-modes-3/border-conflict-element-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vlr-011.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vlr-013.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-010.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/border-conflict-element-vrl-012.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-003.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-005.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-007.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-009.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-011.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vlr-013.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-002.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-004.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-006.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-008.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-010.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/border-conflict-element-vrl-012.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/border-spacing-vlr-003.xht css-writing-modes-3/border-spacing-vrl-002-ref.xht
== css-writing-modes-3/border-spacing-vlr-005.xht css-writing-modes-3/border-spacing-vrl-002-ref.xht
== css-writing-modes-3/border-spacing-vrl-002.xht css-writing-modes-3/border-spacing-vrl-002-ref.xht
== css-writing-modes-3/border-spacing-vrl-004.xht css-writing-modes-3/border-spacing-vrl-002-ref.xht
== css-writing-modes-3/border-vlr-007.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/border-vrl-006.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/box-offsets-rel-pos-vlr-003.xht css-writing-modes-3/abs-pos-non-replaced-vlr-013-ref.xht
fuzzy-if(OSX,255,200) == css-writing-modes-3/box-offsets-rel-pos-vlr-005.xht css-writing-modes-3/box-offsets-rel-pos-vlr-005-ref.xht
== css-writing-modes-3/box-offsets-rel-pos-vrl-002.xht css-writing-modes-3/abs-pos-non-replaced-vrl-012-ref.xht
fuzzy-if(OSX,255,200) == css-writing-modes-3/box-offsets-rel-pos-vrl-004.xht css-writing-modes-3/box-offsets-rel-pos-vrl-004-ref.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vlr-003.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vlr-005.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vrl-002.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/caption-side-vrl-004.xht reference/ref-filled-green-100px-square.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/central-baseline-alignment-002.xht css-writing-modes-3/central-baseline-alignment-002-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/central-baseline-alignment-003.xht css-writing-modes-3/central-baseline-alignment-002-ref.xht
== css-writing-modes-3/clearance-calculations-vrl-002.xht css-writing-modes-3/clearance-calculations-vrl-002-ref.xht
== css-writing-modes-3/clearance-calculations-vrl-004.xht css-writing-modes-3/clearance-calculations-vrl-004-ref.xht
== css-writing-modes-3/clearance-calculations-vrl-006.xht css-writing-modes-3/clearance-calculations-vrl-006-ref.xht
== css-writing-modes-3/clearance-calculations-vrl-008.xht css-writing-modes-3/clearance-calculations-vrl-008-ref.xht
== css-writing-modes-3/clip-rect-vlr-003.xht css-writing-modes-3/clip-rect-vrl-002-ref.xht
== css-writing-modes-3/clip-rect-vlr-005.xht css-writing-modes-3/clip-rect-vrl-004-ref.xht
@@ -695,95 +702,103 @@ fuzzy-if(OSX||winWidget,215,780) == css-
== css-writing-modes-3/clip-rect-vrl-002.xht css-writing-modes-3/clip-rect-vrl-002-ref.xht
== css-writing-modes-3/clip-rect-vrl-004.xht css-writing-modes-3/clip-rect-vrl-004-ref.xht
== css-writing-modes-3/clip-rect-vrl-006.xht css-writing-modes-3/clip-rect-vrl-006-ref.xht
== css-writing-modes-3/clip-rect-vrl-008.xht css-writing-modes-3/clip-rect-vrl-008-ref.xht
== css-writing-modes-3/clip-rect-vrl-010.xht css-writing-modes-3/clip-rect-vrl-010-ref.xht
== css-writing-modes-3/clip-rect-vrl-012.xht css-writing-modes-3/clip-rect-vrl-012-ref.xht
== css-writing-modes-3/clip-rect-vrl-014.xht css-writing-modes-3/clip-rect-vrl-014-ref.xht
== css-writing-modes-3/clip-rect-vrl-016.xht css-writing-modes-3/clip-rect-vrl-016-ref.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
-fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/different-block-flow-dir-001.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/different-block-flow-dir-002.xht css21/reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-003.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-005.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-007.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vlr-009.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-002.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-004.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-006.xht reference/ref-filled-green-100px-square.xht
+fails-if(!stylo) == css-writing-modes-3/contiguous-floated-table-vrl-008.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/different-block-flow-dir-001.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/different-block-flow-dir-002.xht reference/ref-filled-green-100px-square.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/direction-vlr-003.xht css-writing-modes-3/direction-vlr-003-ref.xht
-fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/direction-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/direction-vlr-005.xht reference/ref-filled-green-100px-square.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/direction-vrl-002.xht css-writing-modes-3/direction-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/direction-vrl-004.xht css-writing-modes-3/direction-vrl-004-ref.xht
fails-if(!stylo) == css-writing-modes-3/flexbox_align-items-stretch-writing-modes.html css-writing-modes-3/flexbox_align-items-stretch-writing-modes-ref.html
-== css-writing-modes-3/float-clear-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-clear-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vlr-003.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vlr-005.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vlr-007.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vlr-009.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vrl-002.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vrl-004.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vrl-006.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-clear-vrl-008.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/float-contiguous-vlr-003.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
== css-writing-modes-3/float-contiguous-vlr-005.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
== css-writing-modes-3/float-contiguous-vlr-007.xht css-writing-modes-3/float-contiguous-vlr-007-ref.xht
== css-writing-modes-3/float-contiguous-vlr-009.xht css-writing-modes-3/float-contiguous-vlr-009-ref.xht
-fuzzy-if(OSX||winWidget,135,902) == css-writing-modes-3/float-contiguous-vlr-011.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,135,902) == css-writing-modes-3/float-contiguous-vlr-013.xht css-writing-modes-3/float-contiguous-vrl-012-ref.xht
+fuzzy-if(OSX||winWidget,103,902) == css-writing-modes-3/float-contiguous-vlr-011.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,103,902) == css-writing-modes-3/float-contiguous-vlr-013.xht css-writing-modes-3/float-contiguous-vrl-012-ref.xht
== css-writing-modes-3/float-contiguous-vrl-002.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
== css-writing-modes-3/float-contiguous-vrl-004.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
== css-writing-modes-3/float-contiguous-vrl-006.xht css-writing-modes-3/float-contiguous-vrl-006-ref.xht
== css-writing-modes-3/float-contiguous-vrl-008.xht css-writing-modes-3/float-contiguous-vrl-008-ref.xht
-fuzzy-if(OSX||winWidget,135,902) == css-writing-modes-3/float-contiguous-vrl-010.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,135,902) == css-writing-modes-3/float-contiguous-vrl-012.xht css-writing-modes-3/float-contiguous-vrl-012-ref.xht
-== css-writing-modes-3/float-shrink-to-fit-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-shrink-to-fit-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-shrink-to-fit-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/float-shrink-to-fit-vrl-vlr-016.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-011.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-013.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-004.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-006.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-010.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-012.xht css21/reference/ref-filled-green-100px-square.xht
-!= css-writing-modes-3/full-width-001.html css-writing-modes-3/reference/full-width-001-horizontal-notref.html
-!= css-writing-modes-3/full-width-001.html css-writing-modes-3/reference/full-width-001-nofullwidth-notref.html
-!= css-writing-modes-3/full-width-002.html css-writing-modes-3/reference/full-width-002-notcu-notref.html
-!= css-writing-modes-3/full-width-002.html css-writing-modes-3/reference/full-width-002-horizontal-notref.html
+fuzzy-if(OSX||winWidget,103,902) == css-writing-modes-3/float-contiguous-vrl-010.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,103,902) == css-writing-modes-3/float-contiguous-vrl-012.xht css-writing-modes-3/float-contiguous-vrl-012-ref.xht
+== css-writing-modes-3/float-lft-orthog-htb-in-vlr-002.xht css-writing-modes-3/float-lft-orthog-htb-in-vlr-002-ref.xht
+== css-writing-modes-3/float-lft-orthog-htb-in-vrl-002.xht css-writing-modes-3/float-lft-orthog-htb-in-vrl-002-ref.xht
+== css-writing-modes-3/float-lft-orthog-vlr-in-htb-002.xht css-writing-modes-3/float-lft-orthog-vlr-in-htb-002-ref.xht
+== css-writing-modes-3/float-lft-orthog-vrl-in-htb-002.xht css-writing-modes-3/float-lft-orthog-vrl-in-htb-002-ref.xht
+== css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003.xht css-writing-modes-3/float-rgt-orthog-htb-in-vlr-003-ref.xht
+== css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003.xht css-writing-modes-3/float-rgt-orthog-htb-in-vrl-003-ref.xht
+== css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003.xht css-writing-modes-3/float-rgt-orthog-vlr-in-htb-003-ref.xht
+== css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003.xht css-writing-modes-3/float-rgt-orthog-vrl-in-htb-003-ref.xht
+== css-writing-modes-3/float-shrink-to-fit-vlr-003.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vlr-005.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vlr-007.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-shrink-to-fit-vlr-009.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vrl-002.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vrl-004.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vrl-006.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-shrink-to-fit-vrl-008.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/float-shrink-to-fit-vrl-vlr-016.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-003.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-005.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-007.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-009.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-011.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vlr-013.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-002.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-004.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-006.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-008.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-010.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,93,300) == css-writing-modes-3/float-vrl-012.xht reference/ref-filled-green-100px-square.xht
+fails-if(stylo) != css-writing-modes-3/full-width-001.html css-writing-modes-3/reference/full-width-001-horizontal-notref.html
+fails-if(stylo) != css-writing-modes-3/full-width-001.html css-writing-modes-3/reference/full-width-001-nofullwidth-notref.html
+fails-if(stylo) != css-writing-modes-3/full-width-002.html css-writing-modes-3/reference/full-width-002-notcu-notref.html
+fails-if(stylo) != css-writing-modes-3/full-width-002.html css-writing-modes-3/reference/full-width-002-horizontal-notref.html
skip != css-writing-modes-3/full-width-003.html css-writing-modes-3/reference/full-width-002-notcu-notref.html
skip != css-writing-modes-3/full-width-003.html css-writing-modes-3/reference/full-width-002-horizontal-notref.html
-fuzzy-if(OSX||winWidget,62,404) == css-writing-modes-3/height-width-inline-non-replaced-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,62,404) == css-writing-modes-3/height-width-inline-non-replaced-vlr-003.xht reference/ref-filled-green-100px-square.xht
fuzzy-if(OSX||winWidget,62,404) == css-writing-modes-3/height-width-inline-non-replaced-vrl-002.xht css-writing-modes-3/abs-pos-non-replaced-icb-vrl-008-ref.xht
== css-writing-modes-3/horizontal-rule-vlr-003.xht css-writing-modes-3/horizontal-rule-vlr-003-ref.xht
== css-writing-modes-3/horizontal-rule-vlr-005.xht css-writing-modes-3/horizontal-rule-vrl-004-ref.xht
== css-writing-modes-3/horizontal-rule-vrl-002.xht css-writing-modes-3/horizontal-rule-vrl-002-ref.xht
== css-writing-modes-3/horizontal-rule-vrl-004.xht css-writing-modes-3/horizontal-rule-vrl-004-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-block-alignment-002.xht css-writing-modes-3/inline-block-alignment-002-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-block-alignment-003.xht css-writing-modes-3/inline-block-alignment-003-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-block-alignment-004.xht css-writing-modes-3/inline-block-alignment-002-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-block-alignment-005.xht css-writing-modes-3/inline-block-alignment-003-ref.xht
fuzzy-if(OSX||winWidget,111,960) == css-writing-modes-3/inline-block-alignment-006.xht css-writing-modes-3/inline-block-alignment-006-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-block-alignment-007.xht css-writing-modes-3/inline-block-alignment-006-ref.xht
fuzzy-if(OSX||winWidget,218,621) == css-writing-modes-3/inline-block-alignment-orthogonal-vlr-003.xht css-writing-modes-3/inline-block-alignment-orthogonal-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,218,621) == css-writing-modes-3/inline-block-alignment-orthogonal-vlr-005.xht css-writing-modes-3/inline-block-alignment-orthogonal-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,218,621) == css-writing-modes-3/inline-block-alignment-orthogonal-vrl-002.xht css-writing-modes-3/inline-block-alignment-orthogonal-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,218,621) == css-writing-modes-3/inline-block-alignment-orthogonal-vrl-004.xht css-writing-modes-3/inline-block-alignment-orthogonal-vrl-002-ref.xht
-fuzzy-if(OSX||winWidget,135,1080) == css-writing-modes-3/inline-block-alignment-slr-009.xht css-writing-modes-3/inline-block-alignment-slr-009-ref.xht
+fuzzy-if(OSX||winWidget,104,1080) == css-writing-modes-3/inline-block-alignment-slr-009.xht css-writing-modes-3/inline-block-alignment-slr-009-ref.xht
fuzzy-if(OSX||winWidget,111,960) == css-writing-modes-3/inline-block-alignment-srl-008.xht css-writing-modes-3/inline-block-alignment-006-ref.xht
== css-writing-modes-3/inline-replaced-vlr-003.xht css-writing-modes-3/inline-replaced-vrl-002-ref.xht
== css-writing-modes-3/inline-replaced-vlr-005.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
== css-writing-modes-3/inline-replaced-vrl-002.xht css-writing-modes-3/inline-replaced-vrl-002-ref.xht
== css-writing-modes-3/inline-replaced-vrl-004.xht css-writing-modes-3/inline-replaced-vrl-004-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-table-alignment-002.xht css-writing-modes-3/inline-table-alignment-002-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-table-alignment-003.xht css-writing-modes-3/inline-table-alignment-003-ref.xht
fails-if(!stylo) == css-writing-modes-3/inline-table-alignment-004.xht css-writing-modes-3/inline-table-alignment-002-ref.xht
@@ -834,43 +849,55 @@ fails-if(!stylo) == css-writing-modes-3/
fails-if(!stylo) == css-writing-modes-3/line-box-height-vlr-021.xht css-writing-modes-3/line-box-height-vlr-021-ref.xht
fails-if(!stylo) == css-writing-modes-3/line-box-height-vlr-023.xht css-writing-modes-3/line-box-height-vlr-023-ref.xht
fails-if(!stylo) == css-writing-modes-3/line-box-height-vrl-002.xht css-writing-modes-3/line-box-height-vrl-002-ref.xht
fails-if(!stylo) == css-writing-modes-3/line-box-height-vrl-004.xht css-writing-modes-3/line-box-height-vrl-002-ref.xht
== css-writing-modes-3/line-box-height-vrl-006.xht css-writing-modes-3/line-box-height-vrl-006-ref.xht
== css-writing-modes-3/line-box-height-vrl-008.xht css-writing-modes-3/line-box-height-vrl-006-ref.xht
fails-if(!stylo) == css-writing-modes-3/line-box-height-vrl-010.xht css-writing-modes-3/line-box-height-vrl-010-ref.xht
fails-if(!stylo) == css-writing-modes-3/line-box-height-vrl-012.xht css-writing-modes-3/line-box-height-vrl-010-ref.xht
-== css-writing-modes-3/margin-collapse-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-009.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-011.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-015.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-017.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-025.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-031.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-035.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vlr-037.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-002.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-008.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-010.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-014.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-016.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-024.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-030.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-034.xht css21/reference/ref-filled-green-100px-square.xht
-== css-writing-modes-3/margin-collapse-vrl-036.xht css21/reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-003.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-009.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-011.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-015.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-017.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-025.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-031.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-035.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vlr-037.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-002.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-008.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-010.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-014.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-016.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-024.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-030.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-034.xht reference/ref-filled-green-100px-square.xht
+== css-writing-modes-3/margin-collapse-vrl-036.xht reference/ref-filled-green-100px-square.xht
== css-writing-modes-3/margin-vlr-003.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/margin-vrl-002.xht css-writing-modes-3/margin-vrl-002-ref.xht
+== css-writing-modes-3/normal-flow-overconstrained-vlr-003.xht css-writing-modes-3/abs-pos-non-replaced-vlr-007-ref.xht
+== css-writing-modes-3/normal-flow-overconstrained-vlr-005.xht css-writing-modes-3/abs-pos-non-replaced-vlr-013-ref.xht
+== css-writing-modes-3/normal-flow-overconstrained-vrl-002.xht css-writing-modes-3/abs-pos-non-replaced-vrl-006-ref.xht
+== css-writing-modes-3/normal-flow-overconstrained-vrl-004.xht css-writing-modes-3/abs-pos-non-replaced-vrl-012-ref.xht
== css-writing-modes-3/ortho-htb-alongside-vrl-floats-002.xht css-writing-modes-3/ortho-htb-alongside-vrl-floats-002-ref.xht
== css-writing-modes-3/ortho-htb-alongside-vrl-floats-006.xht css-writing-modes-3/ortho-htb-alongside-vrl-floats-006-ref.xht
== css-writing-modes-3/ortho-htb-alongside-vrl-floats-010.xht css-writing-modes-3/ortho-htb-alongside-vrl-floats-010-ref.xht
== css-writing-modes-3/ortho-htb-alongside-vrl-floats-014.xht css-writing-modes-3/ortho-htb-alongside-vrl-floats-014-ref.xht
== css-writing-modes-3/outline-inline-block-vrl-006.html css-writing-modes-3/reference/outline-inline-block-vrl-006.html
== css-writing-modes-3/outline-inline-vlr-006.html css-writing-modes-3/reference/outline-inline-vlr-006.html
== css-writing-modes-3/outline-inline-vrl-006.html css-writing-modes-3/reference/outline-inline-vrl-006.html
+== css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005.xht css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vlr-005-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004.xht css-writing-modes-3/overconstrained-rel-pos-ltr-left-right-vrl-004-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003.xht css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vlr-003-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002.xht css-writing-modes-3/overconstrained-rel-pos-ltr-top-bottom-vrl-002-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009.xht css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vlr-009-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008.xht css-writing-modes-3/overconstrained-rel-pos-rtl-left-right-vrl-008-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007.xht css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vlr-007-ref.xht
+== css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006.xht css-writing-modes-3/overconstrained-rel-pos-rtl-top-bottom-vrl-006-ref.xht
== css-writing-modes-3/padding-vlr-005.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/padding-vrl-004.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vlr-003.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vlr-005.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vlr-007.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vrl-002.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vrl-004.xht css-writing-modes-3/margin-vrl-002-ref.xht
== css-writing-modes-3/percent-margin-vrl-006.xht css-writing-modes-3/margin-vrl-002-ref.xht
@@ -887,16 +914,128 @@ fuzzy-if(OSX||winWidget,110,1200) == css
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vlr-003.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vlr-005.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vlr-007.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vlr-009.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vrl-002.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vrl-004.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vrl-006.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/row-progression-vrl-008.xht css-writing-modes-3/block-flow-direction-001-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-001.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-001-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-003.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-003-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-004.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-004-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-006.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-006-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-007.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-007-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-008.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-008-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-009.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-003-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-010.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-010-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-011.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-011-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-012.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-006-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-013.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-013-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-015.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-015-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-016.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-016-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-018.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-018-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-019.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-019-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-020.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-020-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-021.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-015-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-022.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-022-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-023.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-023-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vlr-024.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-018-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-001.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-001-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-003.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-003-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-004.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-004-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-006.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-006-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-007.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-007-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-008.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-008-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-009.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-003-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-010.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-010-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-011.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-011-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-012.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-006-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-013.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-013-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-015.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-015-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-016.xht css-writing-modes-3/sizing-orthog-htb-in-vlr-016-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-018.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-018-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-019.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-019-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-020.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-020-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-021.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-015-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-022.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-022-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-023.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-023-ref.xht
+== css-writing-modes-3/sizing-orthog-htb-in-vrl-024.xht css-writing-modes-3/sizing-orthog-htb-in-vrl-018-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-001-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-002-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-003-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-004-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-005-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-006-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-007-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vlr-008-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-001-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-002-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-003-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-004-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-005-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-006-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-007-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008.xht css-writing-modes-3/sizing-orthog-prct-htb-in-vrl-008-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-001-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-002-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-003-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-004-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-005-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-006-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-007-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008.xht css-writing-modes-3/sizing-orthog-prct-vlr-in-htb-008-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-001-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-002-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-003-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-004-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-005-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-006-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-007-ref.xht
+== css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008.xht css-writing-modes-3/sizing-orthog-prct-vrl-in-htb-008-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-001.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-001-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-003.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-003-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-004.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-004-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-006.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-006-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-007.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-007-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-008.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-008-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-009.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-009-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-010.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-010-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-011.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-011-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-012.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-012-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-013.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-013-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-015.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-015-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-016.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-016-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-018.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-018-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-019.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-019-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-020.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-020-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-021.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-015-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-022.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-022-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-023.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-023-ref.xht
+== css-writing-modes-3/sizing-orthog-vlr-in-htb-024.xht css-writing-modes-3/sizing-orthog-vlr-in-htb-018-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-001.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-001-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-003.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-003-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-004.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-004-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-006.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-006-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-007.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-007-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-008.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-008-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-009.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-009-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-010.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-010-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-011.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-011-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-012.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-012-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-013.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-013-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-015.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-015-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-016.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-016-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-018.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-018-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-019.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-019-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-020.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-020-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-021.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-015-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-022.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-022-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-023.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-023-ref.xht
+== css-writing-modes-3/sizing-orthog-vrl-in-htb-024.xht css-writing-modes-3/sizing-orthog-vrl-in-htb-018-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/table-column-order-002.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/table-column-order-003.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/table-column-order-004.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/table-column-order-005.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(winWidget,110,1200) == css-writing-modes-3/table-column-order-slr-007.xht css-writing-modes-3/block-flow-direction-001-ref.xht
fuzzy-if(OSX||winWidget,110,1200) == css-writing-modes-3/table-column-order-srl-006.xht css-writing-modes-3/block-flow-direction-001-ref.xht
== css-writing-modes-3/table-progression-slr-001.html css-writing-modes-3/table-progression-slr-001-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-slr-002.html css-writing-modes-3/table-progression-002-ref.html
@@ -905,19 +1044,19 @@ fails-if(!stylo) == css-writing-modes-3/
== css-writing-modes-3/table-progression-vlr-001.html css-writing-modes-3/table-progression-001-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vlr-002.html css-writing-modes-3/table-progression-002-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vlr-003.html css-writing-modes-3/table-progression-001-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vlr-004.html css-writing-modes-3/table-progression-002-ref.html
== css-writing-modes-3/table-progression-vrl-001.html css-writing-modes-3/table-progression-001-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vrl-002.html css-writing-modes-3/table-progression-002-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vrl-003.html css-writing-modes-3/table-progression-001-ref.html
fails-if(!stylo) == css-writing-modes-3/table-progression-vrl-004.html css-writing-modes-3/table-progression-002-ref.html
-fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-003.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-005.xht css21/reference/ref-filled-green-100px-square.xht
-fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-007.xht css21/reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-003.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-005.xht reference/ref-filled-green-100px-square.xht
+fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-007.xht reference/ref-filled-green-100px-square.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-009.xht css-writing-modes-3/text-align-vlr-009-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-011.xht css-writing-modes-3/text-align-vlr-009-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-013.xht css-writing-modes-3/text-align-vlr-009-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-015.xht css-writing-modes-3/direction-vlr-003-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-017.xht css-writing-modes-3/direction-vlr-003-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vlr-019.xht css-writing-modes-3/direction-vlr-003-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vrl-002.xht css-writing-modes-3/direction-vrl-004-ref.xht
fuzzy-if(OSX||winWidget,75,404) == css-writing-modes-3/text-align-vrl-004.xht css-writing-modes-3/direction-vrl-004-ref.xht
@@ -931,26 +1070,26 @@ fuzzy-if(OSX||winWidget,75,404) == css-w
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-slr-009.xht css-writing-modes-3/text-baseline-slr-009-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-srl-008.xht css-writing-modes-3/text-baseline-vrl-006-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vlr-003.xht css-writing-modes-3/text-baseline-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vlr-005.xht css-writing-modes-3/text-baseline-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vlr-007.xht css-writing-modes-3/text-baseline-vrl-006-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vrl-002.xht css-writing-modes-3/text-baseline-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vrl-004.xht css-writing-modes-3/text-baseline-vrl-002-ref.xht
fuzzy-if(OSX||winWidget,215,780) == css-writing-modes-3/text-baseline-vrl-006.xht css-writing-modes-3/text-baseline-vrl-006-ref.xht
-fuzzy-if(OSX,15,16) == css-writing-modes-3/text-combine-upright-decorations-001.html css-writing-modes-3/reference/text-combine-upright-decorations-001.html
-== css-writing-modes-3/text-combine-upright-inherit-all-001.html css-writing-modes-3/reference/text-combine-upright-inherit-all-001.html
-== css-writing-modes-3/text-combine-upright-inherit-all-002.html css-writing-modes-3/reference/text-combine-upright-inherit-all-002.html
+skip-if(stylo) fuzzy-if(OSX,15,16) == css-writing-modes-3/text-combine-upright-decorations-001.html css-writing-modes-3/reference/text-combine-upright-decorations-001.html
+fails-if(stylo) == css-writing-modes-3/text-combine-upright-inherit-all-001.html css-writing-modes-3/reference/text-combine-upright-inherit-all-001.html
+fails-if(stylo) == css-writing-modes-3/text-combine-upright-inherit-all-002.html css-writing-modes-3/reference/text-combine-upright-inherit-all-002.html
== css-writing-modes-3/text-combine-upright-layout-rules-001.html css-writing-modes-3/reference/text-combine-upright-layout-rules-001-ref.html
-== css-writing-modes-3/text-combine-upright-line-breaking-rules-001.html css-writing-modes-3/text-combine-upright-line-breaking-rules-001-ref.html
-fuzzy(255,960) == css-writing-modes-3/text-combine-upright-value-all-001.html css-writing-modes-3/reference/text-combine-upright-value-single-character.html
-fuzzy(255,960) == css-writing-modes-3/text-combine-upright-value-all-002.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
-fuzzy(255,960) != css-writing-modes-3/text-combine-upright-value-all-002.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
-fuzzy(255,960) == css-writing-modes-3/text-combine-upright-value-all-003.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
-fuzzy(255,960) != css-writing-modes-3/text-combine-upright-value-all-003.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
+fails-if(stylo) == css-writing-modes-3/text-combine-upright-line-breaking-rules-001.html css-writing-modes-3/text-combine-upright-line-breaking-rules-001-ref.html
+fuzzy(255,960) fails-if(stylo) == css-writing-modes-3/text-combine-upright-value-all-001.html css-writing-modes-3/reference/text-combine-upright-value-single-character.html
+fuzzy(255,960) fails-if(stylo) == css-writing-modes-3/text-combine-upright-value-all-002.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
+fuzzy(255,960) fails-if(stylo) != css-writing-modes-3/text-combine-upright-value-all-002.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
+fuzzy(255,960) fails-if(stylo) == css-writing-modes-3/text-combine-upright-value-all-003.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
+fuzzy(255,960) fails-if(stylo) != css-writing-modes-3/text-combine-upright-value-all-003.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
skip == css-writing-modes-3/text-combine-upright-value-digits2-001.html css-writing-modes-3/reference/text-combine-upright-value-single-character.html
skip == css-writing-modes-3/text-combine-upright-value-digits2-002.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
skip != css-writing-modes-3/text-combine-upright-value-digits2-002.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
== css-writing-modes-3/text-combine-upright-value-digits2-003.html css-writing-modes-3/reference/vertical-ahem-1x3-ref.html
!= css-writing-modes-3/text-combine-upright-value-digits2-003.html css-writing-modes-3/reference/horizontal-ahem-1x3-notref.html
skip == css-writing-modes-3/text-combine-upright-value-digits3-001.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
skip != css-writing-modes-3/text-combine-upright-value-digits3-001.html css-writing-modes-3/reference/horizontal-ahem-1x1-notref.html
skip == css-writing-modes-3/text-combine-upright-value-digits3-002.html css-writing-modes-3/reference/vertical-ahem-1x1-ref.html
@@ -1020,23 +1159,27 @@ fails-if(!stylo) == css-writing-modes-3/
fails-if(!stylo) == css-writing-modes-3/wm-propagation-body-011.xht css-writing-modes-3/wm-propagation-body-003-ref.xht
fails-if(!stylo) == css-writing-modes-3/wm-propagation-body-015.xht css-writing-modes-3/block-flow-direction-025-ref.xht
== css-writing-modes-3/writing-mode-horizontal-001l.html css-writing-modes-3/reference/writing-mode-horizontal-001l-ref.html
== css-writing-modes-3/writing-mode-horizontal-001r.html css-writing-modes-3/reference/writing-mode-horizontal-001r-ref.html
fuzzy-if(OSX||winWidget,153,612) == css-writing-modes-3/writing-mode-vertical-lr-002.xht css-writing-modes-3/reftest/writing-mode-vertical-lr-002-ref.xht
fuzzy-if(OSX||winWidget,153,612) == css-writing-modes-3/writing-mode-vertical-rl-001.xht css-writing-modes-3/reftest/writing-mode-vertical-rl-001-ref.xht
fuzzy-if(OSX||winWidget,153,612) == css-writing-modes-3/writing-mode-vertical-rl-002.xht css-writing-modes-3/reftest/writing-mode-vertical-rl-002-ref.xht
fuzzy-if(OSX||winWidget,153,612) == css-writing-modes-3/writing-mode-vertical-rl-003.htm css-writing-modes-3/writing-mode-vertical-rl-003-ref.htm
-needs-focus == selectors-4/focus-within-001.html selectors-4/focus-within-001-ref.html
-needs-focus == selectors-4/focus-within-002.html selectors-4/focus-within-001-ref.html
-needs-focus == selectors-4/focus-within-003.html selectors-4/focus-within-001-ref.html
-needs-focus == selectors-4/focus-within-004.html selectors-4/focus-within-001-ref.html
-needs-focus == selectors-4/focus-within-005.html selectors-4/focus-within-001-ref.html
-needs-focus == selectors-4/focus-within-006.html selectors-4/focus-within-001-ref.html
-fails-if(!stylo) needs-focus == selectors-4/focus-within-shadow-001.html selectors-4/focus-within-shadow-001-ref.html
-pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors-4/focus-within-shadow-002.html selectors-4/focus-within-shadow-001-ref.html
-pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors-4/focus-within-shadow-003.html selectors-4/focus-within-shadow-001-ref.html
-pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors-4/focus-within-shadow-004.html selectors-4/focus-within-shadow-001-ref.html
-pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors-4/focus-within-shadow-005.html selectors-4/focus-within-shadow-001-ref.html
-== selectors-4/of-type-selectors.xhtml selectors-4/of-type-selectors-ref.xhtml
-== selectors-4/selector-required.html selectors-4/selector-required-ref.html
-== selectors-4/selectors-dir-selector-ltr-001.html selectors-4/selectors-dir-selector-ref.html
-== selectors-4/selectors-dir-selector-rtl-001.html selectors-4/selectors-dir-selector-ref.html
+needs-focus == selectors4/focus-within-001.html selectors4/focus-within-001-ref.html
+needs-focus == selectors4/focus-within-002.html selectors4/focus-within-001-ref.html
+needs-focus == selectors4/focus-within-003.html selectors4/focus-within-001-ref.html
+needs-focus == selectors4/focus-within-004.html selectors4/focus-within-001-ref.html
+needs-focus == selectors4/focus-within-005.html selectors4/focus-within-001-ref.html
+needs-focus == selectors4/focus-within-006.html selectors4/focus-within-006-ref.html
+needs-focus == selectors4/focus-within-007.html selectors4/focus-within-007-ref.html
+needs-focus == selectors4/focus-within-008.html selectors4/focus-within-007-ref.html
+== selectors4/focus-within-010.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-001.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-002.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-003.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-004.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-005.html selectors4/focus-within-shadow-001-ref.html
+pref(dom.webcomponents.enabled,true) needs-focus skip-if(stylo) == selectors4/focus-within-shadow-006.html selectors4/focus-within-shadow-001-ref.html
+== selectors4/of-type-selectors.xhtml selectors4/of-type-selectors-ref.xhtml
+== selectors4/selector-required.html selectors4/selector-required-ref.html
+== selectors4/selectors-dir-selector-ltr-001.html reference/ref-filled-green-100px-square.xht
+== selectors4/selectors-dir-selector-rtl-001.html reference/ref-filled-green-100px-square.xht
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-001-ref.html
+++ /dev/null
@@ -1,15 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<meta charset="utf-8">
-<title>Selectors Level 4: focus-within Reference File</title>
-<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
-<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
-<style>
-div {
- border: solid 15px green;
-}
-</style>
-<p>Test passes if, when the element below is focused, it is surrounded by a thick green border. There must be no red or blue once it is focused.</p>
-<div>Focus this element</div>
-</body>
-</html>
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-001.html
+++ /dev/null
@@ -1,39 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<meta charset="utf-8">
-<title>Selectors Level 4: focus-within</title>
-<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
-<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
-<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
-<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
-<meta name="assert" content="Test that :focus-within applies to an element with tabindex when :focus applies.">
-<style>
-/* Suppress things that cannot be reproduced in the reference file */
-:focus {
- outline: none;
-}
-
-/* Use blue to indicate that the user needs to pay attention.
- This element needs to be focused for the test to make sense. */
-div {
-border: solid 15px blue;
-}
-div:focus {
-border-color: red;
-}
-div:focus-within {
-border-color: green;
-}
-</style>
-<p>Test passes if, when the element below is focused, it is surrounded by a thick green border. There must be no red or blue once it is focused.</p>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1">Focus this element</div>
-<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
-var focusme = document.getElementById('focusme');
-focusme.focus();
-</script>
-<body>
-</html>
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-005.html
+++ /dev/null
@@ -1,53 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<meta charset="utf-8">
-<title>Selectors Level 4: focus-within</title>
-<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
-<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
-<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
-<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
-<meta name="assert" content="Test that :focus-within works on links.">
-<style>
-/* Suppress things that cannot be reproduced in the reference file */
-:focus {
- outline: none;
-}
-
-/* Use blue to indicate that the user needs to pay attention.
- This element needs to be focused for the test to make sense. */
-#focusme:not(:focus) {
- border: solid 15px blue;
-}
-
-/* Make the link look like the div in the reference file */
-#focusme {
- display: block;
- text-decoration: none;
- color: currentColor;
-}
-
-:focus {
- border: solid 5px red;
-}
-div:focus-within, #focusme:focus-within {
- border: solid 5px green;
-}
-</style>
-<p>Test passes if, when the element below is focused,
-it is surrounded by a thick green border.
-There must be no red or blue once it is focused.</p>
-<div>
- <div>
- <a id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" href="">Focus this element</a>
- </div>
-</div>
-<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
-var editor = document.getElementById('focusme');
-editor.focus();
-</script>
-<body>
-</html>
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-006.html
+++ /dev/null
@@ -1,55 +0,0 @@
-<!DOCTYPE html>
-<html lang=en>
-<meta charset="utf-8">
-<title>Selectors Level 4: focus-within</title>
-<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
-<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
-<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
-<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
-<meta name="assert" content="Test that :focus-within works on form controls, using an input element.">
-<style>
-/* Suppress things that cannot be reproduced in the reference file */
-:focus {
- all: initial;
- outline: none;
-
- /* Make the caret invisible
- since it matches the color of the text, which is transparent,
- while keeping the text readable thanks to its shadow.
- Not using the caret-color property as it is too new to be relied on. */
- color: transparent; text-shadow: black 0px 0px 0px;
-}
-
-/* Use blue to indicate that the user needs to pay attention.
- This element needs to be focused for the test to make sense. */
-#focusme:not(:focus) {
- border: solid 15px blue;
-}
-
-#focusme:focus:not(:focus-within) {
- background: red;
-}
-div:focus-within {
- border: solid 5px green;
-}
-</style>
-<p>Test passes if, when the element below is focused,
-it is surrounded by a thick green border.
-There must be no red or blue once it is focused.</p>
-<div>
- <div>
- <div>
- <input id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" value="Focus this element">
- <div>
- </div>
-</div>
-<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
-var editor = document.getElementById('focusme');
-editor.focus();
-</script>
-<body>
-</html>
deleted file mode 100644
--- a/layout/reftests/w3c-css/received/selectors-4/selectors-dir-selector-ref.html
+++ /dev/null
@@ -1,19 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
- <title>CSS Reftest Reference for CSS Selectors Level 4 :dir() Tests</title>
- <link rel="author" title="Takeshi Kurosawa" href="mailto:taken.spc@gmail.com">
- <meta name="flags" content="">
- <style type="text/css">
- div {
- width: 100px;
- height: 100px;
- background-color: green;
- }
- </style>
-</head>
-<body>
- <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
- <div></div>
-</body>
-</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/OWNERS
@@ -0,0 +1,3 @@
+@frivoal
+@plinss
+@tabatkins
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-001-ref.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang=en>
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within Reference File</title>
+<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<style>
+div {
+ border: solid 15px green;
+}
+</style>
+<p>Test passes if, when the element below is focused,
+it is surrounded by a thick green border.
+There must be no red or blue once it is focused.</p>
+<div>Focus this element</div>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-001.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang=en class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-001-ref.html">
+<meta name="assert" content="Test that :focus-within applies to an element with tabindex when :focus applies.">
+<style>
+/* Suppress things that cannot be reproduced in the reference file */
+:focus {
+ outline: none;
+}
+
+/* Use blue to indicate that the user needs to pay attention.
+ This element needs to be focused for the test to make sense. */
+div {
+border: solid 15px blue;
+}
+div:focus {
+border-color: red;
+}
+div:focus-within {
+border-color: green;
+}
+</style>
+<p>Test passes if, when the element below is focused,
+it is surrounded by a thick green border.
+There must be no red or blue once it is focused.</p>
+<div id="focusme" tabindex="1">Focus this element</div>
+<script>
+var focusme = document.getElementById('focusme');
+focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-002.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-002.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-002.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-002.html
@@ -1,17 +1,16 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
<meta name="assert" content="Test that :focus-within applies to the parent of an element with tabindex where :focus applies.">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
/* Use blue to indicate that the user needs to pay attention.
@@ -23,19 +22,16 @@
#target:focus-within {
border: solid 15px green;
}
</style>
<p>Test passes if, when the element below is focused,
it is surrounded by a thick green border.
There must be no red or blue once it is focused.</p>
<div id="target">
- <div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1">Focus this element</div>
+ <div id="focusme" tabindex="1">Focus this element</div>
</div>
<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
var focusme = document.getElementById('focusme');
focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
</script>
-<body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-003.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-003.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-003.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-003.html
@@ -1,17 +1,16 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
<meta name="assert" content="Test that :focus-within applies to ancestors of an element with tabindex where :focus applies.">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
/* Use blue to indicate that the user needs to pay attention.
@@ -26,22 +25,19 @@
</style>
<p>Test passes if, when the element below is focused,
it is surrounded by a thick green border.
There must be no red or blue once it is focused.</p>
<div id="target">
<div>
<div>
<div>
- <div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1">Focus this element</div>
+ <div id="focusme" tabindex="1">Focus this element</div>
</div>
</div>
</div>
</div>
<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
var focusme = document.getElementById('focusme');
focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
</script>
-<body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-004.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-004.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-004.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-004.html
@@ -1,17 +1,16 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-001-ref.html">
-<meta name="flags" content="interact">
<meta name="assert" content="Test that :focus-within works on elements that are focusable due to contenteditable.">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
/* Make the caret invisible
since it matches the color of the text, which is transparent,
@@ -33,20 +32,17 @@ div:focus-within, #focusme:focus-within
border: solid 5px green;
}
</style>
<p>Test passes if, when the element below is focused,
it is surrounded by a thick green border.
There must be no red or blue once it is focused.</p>
<div>
<div>
- <div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" contentEditable="true">Focus this element</div>
+ <div id="focusme" contentEditable="true">Focus this element</div>
</div>
</div>
<script>
-/* This script is an optional convenience,
- simply removing the need to manually focus the element.
- The test is valid even if the script is not run. */
-var editor = document.getElementById('focusme');
-editor.focus();
+var focusme = document.getElementById('focusme');
+focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
</script>
-<body>
</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-005.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang=en class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-001-ref.html">
+<meta name="assert" content="Test that :focus-within works on links.">
+<style>
+/* Suppress things that cannot be reproduced in the reference file */
+:focus {
+ outline: none;
+}
+
+/* Use blue to indicate that the user needs to pay attention.
+ This element needs to be focused for the test to make sense. */
+#focusme:not(:focus) {
+ border: solid 15px blue;
+}
+
+/* Make the link look like the div in the reference file */
+#focusme {
+ display: block;
+ text-decoration: none;
+ color: currentColor;
+}
+
+:focus {
+ border: solid 5px red;
+}
+div:focus-within, #focusme:focus-within {
+ border: solid 5px green;
+}
+</style>
+<p>Test passes if, when the element below is focused,
+it is surrounded by a thick green border.
+There must be no red or blue once it is focused.</p>
+<div>
+ <div>
+ <a id="focusme" href="">Focus this element</a>
+ </div>
+</div>
+<script>
+var focusme = document.getElementById('focusme');
+focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-006-ref.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang=en class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within Reference File</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<style>
+:focus {
+ outline: none;
+
+ /* Make the caret invisible
+ since it matches the color of the text, which is transparent,
+ while keeping the text readable thanks to its shadow.
+ Not using the caret-color property as it is too new to be relied on. */
+ color: transparent; text-shadow: black 0px 0px 0px;
+}
+
+div {
+ border: solid 15px green;
+}
+</style>
+<p>Test passes if, when the element below is focused,
+it is surrounded by a thick green border.
+There must be no red or blue once it is focused.</p>
+<div>
+ <input id="focusme" value="Focus this element">
+</div>
+<script>
+var focusme = document.getElementById('focusme');
+focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-006.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang=en class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
+<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-006-ref.html">
+<meta name="assert" content="Test that :focus-within works on form controls, using an input element.">
+<style>
+:focus {
+ outline: none;
+
+ /* Make the caret invisible
+ since it matches the color of the text, which is transparent,
+ while keeping the text readable thanks to its shadow.
+ Not using the caret-color property as it is too new to be relied on. */
+ color: transparent; text-shadow: black 0px 0px 0px;
+}
+
+/* Use blue to indicate that the user needs to pay attention.
+ This element needs to be focused for the test to make sense. */
+#focusme:not(:focus) {
+ border: solid 15px blue;
+}
+
+#focusme:focus:not(:focus-within) {
+ background: red;
+}
+div:focus-within {
+ border: solid 5px green;
+}
+</style>
+<p>Test passes if, when the element below is focused,
+it is surrounded by a thick green border.
+There must be no red or blue once it is focused.</p>
+<div>
+ <div>
+ <div>
+ <input id="focusme" value="Focus this element">
+ </div>
+ </div>
+</div>
+<script>
+var focusme = document.getElementById('focusme');
+focusme.focus();
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-007-ref.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within Reference File</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<style>
+ html, body, div {
+ border: solid 5px green;
+ }
+</style>
+<p>Test passes if, when the element below is focused, it is surrounded by a green border, and HTML and BODY elements also have a green border. There must be no red or blue once it is focused.</p>
+<div>Focus this element</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-007.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-007-ref.html">
+<meta name="assert" content="Checks that ':focus-within' can be used as universal selector.">
+<style>
+ /* Suppress things that cannot be reproduced in the reference file */
+ :focus {
+ outline: none;
+ }
+ html, body, div {
+ border: solid 5px red;
+ }
+ /* Use blue to indicate that the user needs to pay attention.
+ This element needs to be focused for the test to make sense. */
+ div {
+ border-color: blue;
+ }
+ :focus-within {
+ border-color: green;
+ }
+</style>
+<p>Test passes if, when the element below is focused, it is surrounded by a green border, and HTML and BODY elements also have a green border. There must be no red or blue once it is focused.</p>
+<div id="focusme" tabindex="1">Focus this element</div>
+<script>
+ var focusme = document.getElementById('focusme');
+ focusme.focus();
+ document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-008.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-007-ref.html">
+<meta name="assert" content="Checks that ':focus-within' can be used as universal selector (using *).">
+<style>
+ /* Suppress things that cannot be reproduced in the reference file */
+ :focus {
+ outline: none;
+ }
+ html, body, div {
+ border: solid 5px red;
+ }
+ /* Use blue to indicate that the user needs to pay attention.
+ This element needs to be focused for the test to make sense. */
+ div {
+ border-color: blue;
+ }
+ *:focus-within {
+ border-color: green;
+ }
+</style>
+<p>Test passes if, when the element below is focused, it is surrounded by a green border, and HTML and BODY elements also have a green border. There must be no red or blue once it is focused.</p>
+<div id="focusme" tabindex="1">Focus this element</div>
+<script>
+ var focusme = document.getElementById('focusme');
+ focusme.focus();
+ document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-010.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang=en class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="match" href="focus-within-shadow-001-ref.html">
+<meta name="assert" content="Checks that :focus-within is still applied when focus moves from an element to one of its descendants.">
+<style>
+/* Suppress things that cannot be reproduced in the reference file */
+:focus {
+ outline: none;
+}
+
+#target {
+ display: none;
+}
+
+#wrapper:focus-within > #target {
+ display: block;
+}
+
+#target:focus {
+ border: solid 15px green;
+}
+</style>
+<p>Test passes if there is a green rectangle below.</p>
+<div id="wrapper" tabindex="1">
+ <div id="target" tabindex="2"></div>
+</div>
+<script>
+var wrapper = document.getElementById('wrapper');
+wrapper.focus();
+var target = document.getElementById('target');
+target.focus();
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-001-ref.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-001-ref.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-001-ref.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-001-ref.html
@@ -6,10 +6,9 @@
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<style>
div {
border: solid 15px green;
}
</style>
<p>Test passes if there is a green rectangle below.</p>
<div></div>
-</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-001.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-001.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-001.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-001.html
@@ -1,40 +1,39 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within with shadow DOM</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-shadow-001-ref.html">
-<meta name="flags" content="interact dom">
+<meta name="flags" content="dom">
<meta name="assert" content="Test that :focus-within applies to a focused element inside the shadow DOM.">
<body>
<p>Test passes if there is a green rectangle below.</p>
<div id="shadow-host"><strong>Skip this test, shadow DOM is not supported.</strong></div>
<template id="shadow-template">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
div:focus-within {
border: solid 15px green;
}
</style>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1"></div>
+<div id="focusme" tabindex="1"></div>
</template>
<script>
-var shadow = document.getElementById('shadow-host').createShadowRoot();
+var shadow = document.getElementById('shadow-host').attachShadow({mode: 'open'});
var template = document.getElementById('shadow-template');
var instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-window.setTimeout(function() {
var focusme = shadow.getElementById('focusme');
focusme.focus();
-}, 0);
+document.documentElement.classList.remove('reftest-wait');
</script>
</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-002.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-002.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-002.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-002.html
@@ -1,17 +1,17 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within with shadow DOM</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-shadow-001-ref.html">
-<meta name="flags" content="interact dom">
+<meta name="flags" content="dom">
<meta name="assert" content="Test that :focus-within applies to a shadow host containing a focused element.">
<style>
div:focus-within {
border: solid 15px green;
}
</style>
<body>
<p>Test passes if there is a green rectangle below.</p>
@@ -19,23 +19,22 @@ div:focus-within {
<template id="shadow-template">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
</style>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1"></div>
+<div id="focusme" tabindex="1"></div>
</template>
<script>
-var shadow = document.getElementById('shadow-host').createShadowRoot();
+var shadow = document.getElementById('shadow-host').attachShadow({mode: 'open'});
var template = document.getElementById('shadow-template');
var instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-window.setTimeout(function() {
var focusme = shadow.getElementById('focusme');
focusme.focus();
-}, 0);
+document.documentElement.classList.remove('reftest-wait');
</script>
</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-003.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-003.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-003.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-003.html
@@ -1,17 +1,17 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within with shadow DOM</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-shadow-001-ref.html">
-<meta name="flags" content="interact dom">
+<meta name="flags" content="dom">
<meta name="assert" content="Test that :focus-within applies to the parent of a shadow host containing a focused element.">
<style>
#target:focus-within {
border: solid 15px green;
}
</style>
<body>
<p>Test passes if there is a green rectangle below.</p>
@@ -21,23 +21,22 @@
<template id="shadow-template">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
</style>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1"></div>
+<div id="focusme" tabindex="1"></div>
</template>
<script>
-var shadow = document.getElementById('shadow-host').createShadowRoot();
+var shadow = document.getElementById('shadow-host').attachShadow({mode: 'open'});
var template = document.getElementById('shadow-template');
var instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-window.setTimeout(function() {
var focusme = shadow.getElementById('focusme');
focusme.focus();
-}, 0);
+document.documentElement.classList.remove('reftest-wait');
</script>
</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-004.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-004.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-004.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-004.html
@@ -1,17 +1,17 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within with shadow DOM</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-shadow-001-ref.html">
-<meta name="flags" content="interact dom">
+<meta name="flags" content="dom">
<meta name="assert" content="Test that :focus-within applies to an ancestor of a shadow host containing a focused element.">
<style>
#target:focus-within {
border: solid 15px green;
}
</style>
<body>
<p>Test passes if there is a green rectangle below.</p>
@@ -27,23 +27,22 @@
<template id="shadow-template">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
</style>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1"></div>
+<div id="focusme" tabindex="1"></div>
</template>
<script>
-var shadow = document.getElementById('shadow-host').createShadowRoot();
+var shadow = document.getElementById('shadow-host').attachShadow({mode: 'open'});
var template = document.getElementById('shadow-template');
var instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-window.setTimeout(function() {
var focusme = shadow.getElementById('focusme');
focusme.focus();
-}, 0);
+document.documentElement.classList.remove('reftest-wait');
</script>
</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-005.html
rename to layout/reftests/w3c-css/received/selectors4/focus-within-shadow-005.html
--- a/layout/reftests/w3c-css/received/selectors-4/focus-within-shadow-005.html
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-005.html
@@ -1,16 +1,16 @@
<!DOCTYPE html>
-<html lang=en>
+<html lang=en class="reftest-wait">
<meta charset="utf-8">
<title>Selectors Level 4: focus-within with shadow DOM</title>
<link rel="author" title="Keyong Li" href="mailto:kli79@bloomberg.net">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
<link rel="match" href="focus-within-shadow-001-ref.html">
-<meta name="flags" content="interact dom">
+<meta name="flags" content="dom">
<meta name="assert" content="Test that :focus-within propagates through nested shadow DOMs containing a focused element.">
<style>
#target:focus-within {
border: solid 15px green;
}
</style>
<body>
<p>Test passes if there is a green rectangle below.</p>
@@ -30,31 +30,28 @@
<template id="nested-shadow-template">
<style>
/* Suppress things that cannot be reproduced in the reference file */
:focus {
outline: none;
}
</style>
-<div id="focusme" class="reftest-wait" onfocus="this.classList.toggle('reftest-wait');" tabindex="1"></div>
+<div id="focusme" tabindex="1"></div>
</template>
<script>
-var shadow = document.getElementById('shadow-host').createShadowRoot();
+var shadow = document.getElementById('shadow-host').attachShadow({mode: 'open'});
var template = document.getElementById('shadow-template');
var instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-window.setTimeout(function() {
-shadow = shadow.getElementById('nested-shadow-host').createShadowRoot();
+shadow = shadow.getElementById('nested-shadow-host').attachShadow({mode: 'open'});
template = document.getElementById('nested-shadow-template');
instance = document.importNode(template.content, true);
shadow.appendChild(instance);
-}, 0);
-window.setTimeout(function() {
var focusme = shadow.getElementById('focusme');
focusme.focus();
-}, 0);
+document.documentElement.classList.remove('reftest-wait');
</script>
</body>
</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/received/selectors4/focus-within-shadow-006.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>Selectors Level 4: focus-within with shadow DOM</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/selectors-4/#focus-within-pseudo">
+<link rel="help" href="https://dom.spec.whatwg.org/#shadow-trees">
+<link rel="match" href="focus-within-shadow-001-ref.html">
+<meta name="flags" content="dom">
+<meta name="assert" content="Checks that ':focus-within' is propagated to the flat tree ancestors, even if it comes from a slotted element.">
+<style>
+ /* Suppress things that cannot be reproduced in the reference file */
+ :focus {
+ outline: none;
+ }
+ :focus-within {
+ border-color: green;
+ }
+</style>
+<p>Test passes if there is a green rectangle below.</p>
+
+<div id="log"></div>
+<script>
+ if (!document.body.attachShadow)
+ document.getElementById("log").innerHTML = "<strong>Skip this test, shadow DOM is not supported.</strong>";
+</script>
+
+<div id="shadow-host">
+ <div id="focusme" tabindex="1"></div>
+</div>
+
+<script>
+ var shadowHost = document.getElementById("shadow-host");
+ shadowHost.attachShadow({ mode: "open"}).innerHTML =
+ "<style>" +
+ " #shadow-div:focus-within { border: solid 15px green; }" +
+ "</style>" +
+ "<div id='shadow-div'>" +
+ " <slot></slot>" +
+ "</div>";
+ var focusme = document.getElementById("focusme");
+ focusme.focus();
+ document.documentElement.classList.remove("reftest-wait");
+</script>
+</html>
rename from layout/reftests/w3c-css/received/selectors-4/of-type-selectors-ref.xhtml
rename to layout/reftests/w3c-css/received/selectors4/of-type-selectors-ref.xhtml
rename from layout/reftests/w3c-css/received/selectors-4/of-type-selectors.xhtml
rename to layout/reftests/w3c-css/received/selectors4/of-type-selectors.xhtml
rename from layout/reftests/w3c-css/received/selectors-4/selector-required-ref.html
rename to layout/reftests/w3c-css/received/selectors4/selector-required-ref.html
rename from layout/reftests/w3c-css/received/selectors-4/selector-required.html
rename to layout/reftests/w3c-css/received/selectors4/selector-required.html
rename from layout/reftests/w3c-css/received/selectors-4/selectors-dir-selector-ltr-001.html
rename to layout/reftests/w3c-css/received/selectors4/selectors-dir-selector-ltr-001.html
--- a/layout/reftests/w3c-css/received/selectors-4/selectors-dir-selector-ltr-001.html
+++ b/layout/reftests/w3c-css/received/selectors4/selectors-dir-selector-ltr-001.html
@@ -1,26 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Selectors Level 4 Test: basic support for dir(ltr)</title>
<link rel="author" title="Takeshi Kurosawa" href="mailto:taken.spc@gmail.com">
<link rel="help" href="http://www.w3.org/TR/selectors4/#dir-pseudo">
- <link rel="match" href="selectors-dir-selector-ref.html">
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<meta name="flags" content="">
<meta name="assert" content="The :dir(ltr) pseudo-class matches an element that has a directionality of (ltr). Since the div element has dir=ltr, the selector matches.">
<style type="text/css">
div {
width: 100px;
height: 100px;
background-color: red;
}
div:dir(ltr) {
background-color: green;
}
</style>
</head>
<body>
- <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div dir="ltr"></div>
</body>
</html>
rename from layout/reftests/w3c-css/received/selectors-4/selectors-dir-selector-rtl-001.html
rename to layout/reftests/w3c-css/received/selectors4/selectors-dir-selector-rtl-001.html
--- a/layout/reftests/w3c-css/received/selectors-4/selectors-dir-selector-rtl-001.html
+++ b/layout/reftests/w3c-css/received/selectors4/selectors-dir-selector-rtl-001.html
@@ -1,26 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Selectors Level 4 Test: basic support for dir(rtl)</title>
<link rel="author" title="Takeshi Kurosawa" href="mailto:taken.spc@gmail.com">
<link rel="help" href="http://www.w3.org/TR/selectors4/#dir-pseudo">
- <link rel="match" href="selectors-dir-selector-ref.html">
+ <link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<meta name="flags" content="">
<meta name="assert" content="The :dir(rtl) pseudo-class matches an elment that has a directionality of right-to-left (rtl). Since the div element has dir=rtl, the selector matches.">
<style type="text/css">
div {
width: 100px;
height: 100px;
background-color: red;
}
div:dir(rtl) {
background-color: green;
}
</style>
</head>
<body>
- <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div dir="rtl"></div>
</body>
</html>
