diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-05-15 03:35:49 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-05-15 03:35:49 +0000 |
| commit | d8bbc7858622b6d9c278469aab701ca0b609cddf (patch) | |
| tree | eff41dc61d9f714852212739e6b3738b82a2af87 /testing/web-platform/tests/css/CSS2 | |
| parent | Releasing progress-linux version 125.0.3-1~progress7.99u1. (diff) | |
| download | firefox-d8bbc7858622b6d9c278469aab701ca0b609cddf.tar.xz firefox-d8bbc7858622b6d9c278469aab701ca0b609cddf.zip | |
Merging upstream version 126.0.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/CSS2')
8 files changed, 178 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/CSS2/floats/block-in-inline-become-float.html b/testing/web-platform/tests/css/CSS2/floats/block-in-inline-become-float.html new file mode 100644 index 0000000000..2a415e1838 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/floats/block-in-inline-become-float.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> +<link rel="help" href="http://crbug.com/332396356"> +<link rel="match" href="../../reference/ref-filled-green-100px-square.xht"> +<style> + .half { + display: inline-block; + vertical-align: top; + width: 50px; + height: 100px; + background: green; + } +</style> +<p>Test passes if there is a filled green square and <strong>no red</strong>.</p> +<div style="width:100px; height:100px; background:red;"> + <span> + <div class="half"></div><div id="trouble"></div><div class="half"></div> + </span> +</div> +<script> + document.body.offsetTop; + trouble.style.cssFloat = "left"; +</script> diff --git a/testing/web-platform/tests/css/CSS2/tables/reference/no_red_3x3_monospace_table-ref.xht b/testing/web-platform/tests/css/CSS2/tables/reference/no_red_3x3_monospace_table-ref.xht index 821ddc77b0..5425f5b175 100644 --- a/testing/web-platform/tests/css/CSS2/tables/reference/no_red_3x3_monospace_table-ref.xht +++ b/testing/web-platform/tests/css/CSS2/tables/reference/no_red_3x3_monospace_table-ref.xht @@ -17,6 +17,7 @@ position: absolute; top: 1px; left: 1px; + right: 1px; } td { padding: 0; diff --git a/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-008.xht b/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-008.xht new file mode 100644 index 0000000000..1200ac1ae8 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-008.xht @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Test for baseline alignment of table cells</title> + <link rel="author" title="Oriol Brufau" href="obrufau@igalia.com" /> + <link rel="help" href="https://github.com/servo/servo/issues/31722" /> + <link rel="help" href="https://drafts.csswg.org/css2/#height-layout" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + <meta name="assert" content="Since the cell is empty, the baseline of the row + is synthesized from the bottom content edge of the cell." /> + <style><![CDATA[ + .wrapper { float: left; font-size: 0; background: red } + .wrapper > * { width: 50px; height: 100px; background: green } + ]]></style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div class="wrapper"> + <div style="display: inline-block"></div> + <table style="display: inline-table; border-spacing: 0"> + <td style="vertical-align: baseline; padding: 0"></td> + </table> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht b/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht new file mode 100644 index 0000000000..4620848ddc --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/tables/table-vertical-align-baseline-009.xht @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Test for baseline alignment of table cells</title> + <link rel="author" title="Oriol Brufau" href="obrufau@igalia.com" /> + <link rel="help" href="https://github.com/servo/servo/issues/31651" /> + <link rel="help" href="https://drafts.csswg.org/css2/#height-layout" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + <meta name="assert" content="The baseline of the table should be aligned with the baseline of the cell in the first row." /> + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style><![CDATA[ + span { + font: 50px/1 Ahem; + color: green; + } + ]]></style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div style="float: left; position: relative; font-size: 0; background: red"> + <span style="position: absolute; left: 0; bottom: 0">X</span> + <span>X</span> + <span style="display: inline-table"> + <span style="display: table-row">X</span> + <span style="display: table-row">X</span> + </span> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow-ref.html b/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow-ref.html new file mode 100644 index 0000000000..be2ac9dae1 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> + +<html> +<head> + <title>CSS Test: Overflowing content with text-align: justify</title> + <link rel="author" title="Martin Robinson" href="mrobinson@igalila.com"> + <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> + <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#indentation-prop"> + <link ref="help" href="https://drafts.csswg.org/css-text/#text-align-property"> + <style type="text/css"> + div { + width: 0px; + } + </style> +</head> + +<body> + +<!-- These two divs should overflow, one because of the length of the content + and the other because of `text-indent`. In both of these cases, `text-align: justify` + should be treated like `text-align: left` since there is no extra space to + distribute to justification opportunities. --> +<div>lorem ipsum lastline</div> +<div style="text-indent: 50px">lorem ipsum lastline</div> +</body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow.html b/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow.html new file mode 100644 index 0000000000..927e9afd5a --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/text/text-align-justify-with-overflow.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> + +<html> +<head> + <title>CSS Test: Overflowing content with text-align: justify</title> + <link rel="author" title="Martin Robinson" href="mrobinson@igalila.com"> + <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> + <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#indentation-prop"> + <link ref="help" href="https://drafts.csswg.org/css-text/#text-align-property"> + <link rel="match" href="text-align-justify-with-overflow-ref.html"/> + <style type="text/css"> + div { + text-align: justify; + width: 0px; + } + </style> +</head> + +<body> + +<!-- These two divs should overflow, one because of the length of the content + and the other because of `text-indent`. In both of these cases, `text-align: justify` + should be treated like `text-align: left` since there is no extra space to + distribute to justification opportunities. --> +<div>lorem ipsum lastline</div> +<div style="text-indent: 50px">lorem ipsum lastline</div> + +</body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002-ref.html b/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002-ref.html new file mode 100644 index 0000000000..9750ce4c89 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> + +<html> +<head> + <title>CSS Test: text-indent test (multiple-lines and text-align: justify)</title> + <link rel="author" title="Martin Robinson" href="mrobinson@igalila.com"> + <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> + <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#indentation-prop"> + <link ref="help" href="https://drafts.csswg.org/css-text/#text-align-property"> + <style type="text/css"> + p { + text-align: justify; + } + span { + margin-left: 100px; + background: yellow; + } + </style> +</head> +<body> +<p><span>This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines.</span></p> +</body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002.html b/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002.html new file mode 100644 index 0000000000..128cba3f12 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/text/text-indent-wrap-002.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> + +<html> +<head> + <title>CSS Test: text-indent test (multiple-lines and text-align: justify)</title> + <link rel="author" title="Martin Robinson" href="mrobinson@igalila.com"> + <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> + <link rel="help" href="http://www.w3.org/TR/CSS21/text.html#indentation-prop"> + <link ref="help" href="https://drafts.csswg.org/css-text/#text-align-property"> + <link rel="match" href="text-indent-wrap-002-ref.html"/> + <style type="text/css"> + p { + text-indent: 100px; + text-align: justify; + } + span { background: yellow } + </style> +</head> +<body> +<p><span>This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines. This is a long piece of text that will wrap to multiple lines.</span></p> +</body> +</html> |