diff options
| author | James Graham <james@hoppipolla.co.uk> | 2015-07-27 17:47:31 +0100 |
|---|---|---|
| committer | James Graham <james@hoppipolla.co.uk> | 2015-07-27 17:47:31 +0100 |
| commit | df03062d626f485dd896ce9c4374dfce447dc657 (patch) | |
| tree | a96bdde06c6cd88dd68bc5ef4de8277fc6250a60 /tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference | |
| parent | 662c00a8109c49d4c57343156b774441f4f48640 (diff) | |
| download | servo-df03062d626f485dd896ce9c4374dfce447dc657.tar.gz servo-df03062d626f485dd896ce9c4374dfce447dc657.zip | |
Update CSS tests to revision 2baa72daab8bf37e3e910a9fd311a1eaa5b0f4a8
Diffstat (limited to 'tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference')
17 files changed, 744 insertions, 45 deletions
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flex-container-margin-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flex-container-margin-ref.xht deleted file mode 100644 index 38187fe38ca..00000000000 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flex-container-margin-ref.xht +++ /dev/null @@ -1,33 +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 Test: flex-container-margin-not-collapse-with-content-margin</title> -<link href="http://www.github.com/sskyy" rel="author" title="houzhenyu" /> -<style> - .flex-container{ - display:block; - margin:20px; - background: #333; - line-height: 0px; - } - .flex-item{ - display: inline-block; - width:50px; - height:50px; - margin:20px 20px; - background: #eee; - } - .flex-item.first{ - margin-left:20px; - } - .flex-item.last{ - margin-right: 20px; - } -</style> -</head> -<body> - <div class="flex-container"> - <div class="flex-item first"></div><div class="flex-item"></div><div class="flex-item last"></div> - </div> - - -</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-001-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-001-ref.xht new file mode 100644 index 00000000000..3dd9c2f6a0b --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: ltr; */ + /* Testcase has writing-mode: horizontal-tb; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-002-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-002-ref.xht new file mode 100644 index 00000000000..dfcf6f299d3 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-002-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: ltr; */ + /* Testcase has writing-mode: vertical-rl; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-003-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-003-ref.xht new file mode 100644 index 00000000000..06ec4b44c7a --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: ltr; */ + /* Testcase has writing-mode: vertical-lr; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-004-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-004-ref.xht new file mode 100644 index 00000000000..c097c0de621 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-004-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: rtl; */ + /* Testcase has writing-mode: horizontal-tb; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-005-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-005-ref.xht new file mode 100644 index 00000000000..c6e566c1be0 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-005-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: rtl; */ + /* Testcase has writing-mode: vertical-rl; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-006-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-006-ref.xht new file mode 100644 index 00000000000..da554ffeed6 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-006-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + /* Testcase has direction: rtl; */ + /* Testcase has writing-mode: vertical-lr; */ + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"><!-- row wrap --> + <div class="item2"></div><div class="item4"></div> + <div class="item1"></div><div class="item3"></div> + </div> + <div class="flexContainer"><!-- row wrap-reverse --> + <div class="item4"></div><div class="item2"></div> + <div class="item3"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap --> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- row-reverse wrap-reverse --> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + + <div class="flexContainer"><!-- column wrap --> + <div class="item3"></div><div class="item4"></div> + <div class="item1"></div><div class="item2"></div> + </div> + <div class="flexContainer"><!-- column wrap-reverse --> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap --> + <div class="item4"></div><div class="item3"></div> + <div class="item2"></div><div class="item1"></div> + </div> + <div class="flexContainer"><!-- column-reverse wrap-reverse --> + <div class="item2"></div><div class="item1"></div> + <div class="item4"></div><div class="item3"></div> + </div> + + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-007-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-007-ref.xht new file mode 100644 index 00000000000..8d93f8a2e32 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-007-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item2"></div> + <div class="item3"></div><div class="item4"></div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-008-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-008-ref.xht new file mode 100644 index 00000000000..fd584eaec58 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-008-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + <div class="flexContainer"> + <div class="item1"></div><div class="item3"></div> + <div class="item2"></div><div class="item4"></div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-009-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-009-ref.xht new file mode 100644 index 00000000000..2753f654518 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/flexbox-writing-mode-009-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"> +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--><html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Reftest Reference</title> + <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert" /> + <meta charset="utf-8" /> + <style> + .flexContainer { + width: 40px; + height: 30px; + border: 1px solid gray; + margin-bottom: 5px; + } + .flexContainer > * { + width: 20px; + height: 15px; + float: left; + } + .item1 { + /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */ + background: cyan; + } + .item2 { + background: magenta; + } + .item3 { + background: yellow; + } + .item4 { + background: black; + } + </style> +</head> +<body> + <div class="flexContainer"> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + <div class="flexContainer"> + <div class="item3"></div><div class="item1"></div> + <div class="item4"></div><div class="item2"></div> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-center-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-center-ref.xht index 2006d61565f..d3d3cd72266 100644 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-center-ref.xht +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-center-ref.xht @@ -1,6 +1,6 @@ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> - <title>CSS Flexible Box Test: align-content proprety - center</title> + <title>CSS Flexible Box Test: align-content property - center</title> <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> <style type="text/css"> .container { @@ -26,7 +26,7 @@ </style> </head> <body> - <p>The test passed if you see a 2*2 table.</p> + <p>The test passed if you see a centered 2*2 table.</p> <div class="container"> <span>first</span> <span>second</span> diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-end-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-end-ref.xht index 317a6b35f01..8d1576c78af 100644 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-end-ref.xht +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-end-ref.xht @@ -1,6 +1,6 @@ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> - <title>CSS Flexible Box Test: align-content proprety - flex-end</title> + <title>CSS Flexible Box Test: align-content property - flex-end</title> <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> <style type="text/css"> .container { diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-space-between-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-space-between-ref.xht new file mode 100644 index 00000000000..3ff6255d21d --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-space-between-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 Flexible Box Test: align-content property - space-between</title> + <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> + <style type="text/css"> + .container { + position: relative; + height: 14em; + width: 20em; + background: red; + margin: 1em; + border: 1px solid black; + } + .first, .second { + margin-bottom: 112px; + } + span { + height: 2em; + display: inline-block; + background: green; + color: white; + margin: 1em; + width: 8em; + float: left; + } + </style> +</head> +<body> + <p>The test passed if you see a 2*2 table and all the cells are spaced equally apart.</p> + <div class="container"> + <span class="first">first</span> + <span class="second">second</span> + <span>third</span> + <span>forth</span> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-start-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-start-ref.xht new file mode 100644 index 00000000000..77ab3099ac0 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-align-content-start-ref.xht @@ -0,0 +1,35 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Flexible Box Test: align-content property - flex-start</title> + <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> + <style type="text/css"> + .container { + position: relative; + height: 14em; + width: 20em; + background: red; + margin: 1em; + border: 1px solid black; + } + span { + height: 2em; + display: inline-block; + background: green; + color: white; + margin: 1em; + width: 8em; + float: left; + } + </style> +</head> +<body> + <p>The test passed if you see a 2*2 table and all the cells are at the top of the container.</p> + <div class="container"> + <span>first</span> + <span>second</span> + <span>third</span> + <span>forth</span> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-column-reverse-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-column-reverse-ref.xht new file mode 100644 index 00000000000..dbebba77d51 --- /dev/null +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-column-reverse-ref.xht @@ -0,0 +1,36 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"><head> + <title>CSS Flexible Box Test: flex-direction proprety - column-reverse</title> + <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> + <style type="text/css"> + /* Positioned container allows for the self-describing statement to still + be visible in the case of failure */ + .container { + position: relative; + background: red; + margin: 1em 0; + border: 1px solid black; + } + span ~ span { + margin: 2em 1em 1em; + } + span { + display: block; + background: green; + color: white; + margin: 1em; + width: 8em; + } + </style> +</head> +<body> + <p>The test passed if you see all the cells are arraged vertically and reversed.</p> + <div class="container"> + <span>forth</span> + <span>third</span> + <span>second</span> + <span>first</span> + </div> + + +</body></html>
\ No newline at end of file diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-row-reverse-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-row-reverse-ref.xht index 7817c57e510..88a3a6222ce 100644 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-row-reverse-ref.xht +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-direction-row-reverse-ref.xht @@ -6,7 +6,6 @@ .container { position: relative; display: flex; - flex-direction: row-reverse; background: red; margin: 1em 0; border: 1px solid black; diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-inline-ref.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-wrap-ref.xht index d55e5c26256..92f5a9f6156 100644 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-inline-ref.xht +++ b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/reference/ttwf-reftest-flex-wrap-ref.xht @@ -1,26 +1,35 @@ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> - <title>CSS Flexible Box Test: display proprety - inline-flex</title> + <title>CSS Flexible Box Test: flex-wrap proprety - wrap</title> <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent" /> <style type="text/css"> /* Positioned container allows for the self-describing statement to still be visible in the case of failure */ .container { position: relative; + background: red; + margin: 1em 0; + border: 1px solid black; + width: 20em; + height: 6.5em; } - .greenSquare { + span { display: inline-block; - margin-top: -200px; background: green; - } + color: white; + margin: 1em; + width: 8em; + float: left; + } </style> </head> <body> - <p>The test passed if you see a green block which its text is 'Success! -'.</p> + <p>The test passed if you see a 2 * 2 table on the page.</p> <div class="container"> - <!-- This is the square that should not be visible if the test passes --> - <div class="greenSquare">Success!</div> + <span>first</span> + <span>second</span> + <span>third</span> + <span>forth</span> </div> |