summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-multicol/reference
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
commit43a97878ce14b72f0981164f87f2e35e14151312 (patch)
tree620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/css-multicol/reference
parentInitial commit. (diff)
downloadfirefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz
firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-multicol/reference')
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/column-fill-balance-orthog-block-001-ref.html29
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/multicol-basic-005-ref.xht21
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/multicol-basic-ref.html72
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/multicol-clip-scrolled-content-001-ref.html52
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/nested-oofs-in-relative-multicol-ref.html13
-rw-r--r--testing/web-platform/tests/css/css-multicol/reference/subpixel-column-rule-width-ref.tentative.html92
6 files changed, 279 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-multicol/reference/column-fill-balance-orthog-block-001-ref.html b/testing/web-platform/tests/css/css-multicol/reference/column-fill-balance-orthog-block-001-ref.html
new file mode 100644
index 0000000000..64e0af246d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/reference/column-fill-balance-orthog-block-001-ref.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+
+ <meta charset="UTF-8">
+
+ <title>CSS Reftest Reference</title>
+
+ <link rel="author" title="GĂ©rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
+
+ <style>
+ div#outer
+ {
+ background-color: yellow;
+ height: 250px;
+ }
+
+ div#inner
+ {
+ background-color: lime;
+ font-size: 50px;
+ line-height: 1.2;
+ writing-mode: vertical-rl;
+ }
+ </style>
+
+ <p>Test passes if the word "TEXT" is unbroken and rotated 90 degrees clock-wise.
+
+ <div id="outer">
+ <div id="inner">TEXT</div>
+ </div>
diff --git a/testing/web-platform/tests/css/css-multicol/reference/multicol-basic-005-ref.xht b/testing/web-platform/tests/css/css-multicol/reference/multicol-basic-005-ref.xht
new file mode 100644
index 0000000000..a46863c62f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/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;
+ columns: 3;
+ column-gap: 0;
+ 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 columns with no gap or rule between them.</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-multicol/reference/multicol-basic-ref.html b/testing/web-platform/tests/css/css-multicol/reference/multicol-basic-ref.html
new file mode 100644
index 0000000000..33b4469428
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/reference/multicol-basic-ref.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html>
+<!-- Submitted from TestTWF Paris -->
+<head>
+ <title>CSS Test reference</title>
+ <link rel="author" title="Anselm Hannemann" href="mailto:info@anselm-hannemann.com"/>
+ <link rel="reviewer" title="Elika J Etemad" href="http://fantasai.inkedblade.net/contact">
+ <meta name="flags" content="ahem"/>
+
+ <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+ <style type="text/css">
+ .multicol-wrapper>*{
+ font: 20px/1 Ahem;
+ }
+
+ div.multicol-wrapper{
+ border: thin solid black;
+ display: inline-block;
+ margin: 1em auto;
+ width: 360px;
+ }
+
+ .multicol-basic-ref{
+ background: yellow;
+ width: 360px;
+ border-spacing: 0;
+ border-collapse: collapse;
+ padding: 0;
+ }
+
+ .multicol-basic-ref td{
+ padding: 0;
+ }
+ .multicol-basic-ref-item{
+ padding: 0;
+ width: 120px;
+ background: #000;
+ border-spacing: 0;
+ border-collapse: collapse;
+ display: inline;
+ border: none;
+ }
+
+ .item-1{
+ background: purple;
+ color: purple;
+ }
+
+ .item-2{
+ background: orange;
+ color: orange;
+ }
+
+ .item-3{
+ background: blue;
+ color: blue;
+ }
+ </style>
+</head>
+<body>
+<p>Test passes if there are three vertical stripes in the yellow box below: 1st purple, 2nd orange, 3rd blue.</p>
+<div class="multicol-wrapper">
+ <table class="multicol-basic-ref">
+ <tr>
+ <td><div class="multicol-basic-ref-item item-1">XXXX XXXX XXXX XXXX XXXX XXXX XXXX</div></td>
+ <td><div class="multicol-basic-ref-item item-2">XXXX XXXX XXXX XXXX XXXX XXXX XXXX</div></td>
+ <td><div class="multicol-basic-ref-item item-3">XXXX XXXX XXXX XXXX XXXX XXXX XXXX</div></td>
+ </tr>
+ </table>
+</div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/css-multicol/reference/multicol-clip-scrolled-content-001-ref.html b/testing/web-platform/tests/css/css-multicol/reference/multicol-clip-scrolled-content-001-ref.html
new file mode 100644
index 0000000000..d19ec1b93a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/reference/multicol-clip-scrolled-content-001-ref.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html>
+<meta charset="utf-8">
+<title>CSS Test: Multi-column element with scrolled content clipping (reference)</title>
+<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"/>
+<link rel="help" href="http://www.w3.org/TR/css3-multicol/#columns"/>
+<style>
+#columns {
+ column-width: 350px;
+}
+.spacer {
+ height: 200px;
+ width: 10px;
+}
+#outer {
+ border: 1px solid black;
+ overflow: scroll;
+ height: 300px;
+ width: 300px;
+}
+.inner {
+ overflow: scroll;
+ visibility: hidden;
+}
+.clipped_target {
+ width: 50px;
+ height: 50px;
+}
+</style>
+
+<div class=spacer></div>
+<div id=columns>
+<div class=spacer></div>
+<div id=outer>
+ <div class=inner>
+ <pre class=clipped_target>
+ scrollable
+ content
+ goes
+ here
+ </pre>
+ </div>
+ <div class=spacer></div>
+ <div class=spacer></div>
+</div>
+</div>
+
+<script>
+window.onload = () => { outer.scrollTop = 100; };
+</script>
+</html>
+
diff --git a/testing/web-platform/tests/css/css-multicol/reference/nested-oofs-in-relative-multicol-ref.html b/testing/web-platform/tests/css/css-multicol/reference/nested-oofs-in-relative-multicol-ref.html
new file mode 100644
index 0000000000..01956bf492
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/reference/nested-oofs-in-relative-multicol-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<style>
+.outer {
+ position: relative;
+ margin-left: 100px;
+ width: 400px;
+ height: 400px;
+ background: green;
+}
+</style>
+<body>
+ <div class="outer"></div>
+</body>
diff --git a/testing/web-platform/tests/css/css-multicol/reference/subpixel-column-rule-width-ref.tentative.html b/testing/web-platform/tests/css/css-multicol/reference/subpixel-column-rule-width-ref.tentative.html
new file mode 100644
index 0000000000..47300675fb
--- /dev/null
+++ b/testing/web-platform/tests/css/css-multicol/reference/subpixel-column-rule-width-ref.tentative.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+ <title>
+ CSS Column-Rule: width computed value
+ </title>
+
+ <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org">
+
+ <style>
+ .columns {
+ column-count: 2;
+ column-rule: 1px solid gray;
+ width: 420px;
+ height: 50px;
+ }
+ </style>
+</head>
+
+<body>
+ <h1>
+ Test passes if column rule widths are rounded up
+ when they are greater than 0 and less than 1,
+ and rounded down when they are greater than 1.
+ </h1>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns" style="column-rule-width: 3px;">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns" style="column-rule-width: 3px;">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+
+ <div class="columns" style="column-rule-width: 3px;">
+ Lorem ipsum dolor sit amet,
+ consectetur adipisicing elit,
+ sed do eiusmod tempor incididunt
+ ut labore et dolore magna aliqua.
+ </div>
+</body>
+
+</html>