diff options
Diffstat (limited to 'testing/web-platform/tests/css/CSS2/zindex')
89 files changed, 2308 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001-ref.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001-ref.xht new file mode 100644 index 0000000000..066b803d4b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001-ref.xht @@ -0,0 +1,30 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <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: lime; + border: black solid medium; + height: 100px; + width: 100px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is one single filled bright green square (with a black border) and no red.</p> + + <div></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001.xht new file mode 100644 index 0000000000..739a6c3b49 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-001.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" lang="en"> + <head> + <title>CSS Test: Stacking order: Floats and Blocks in Inlines</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/float/stacking/001.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" /> + <link rel="match" href="stack-floats-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style type="text/css"> + /* outer block */ + .container { width: 5em; height: 5em; border: solid; font: 20px/1 Ahem; background: red; display: block; } + + /* top and bottom */ + .float { width: 5em; height: 3em; margin: 0 0 -5em 0; padding: 1em 0; background: red; float: left; } + .inline { color: lime; display: inline; } + + /* middle */ + .float .block { height: 3em; margin: 0; background: lime; display: block; } + .inline .block { height: 3em; margin: 0; background: red; display: block; } + + </style> + </head> + <body> + <p>Test passes if there is one single filled bright green square (with a black border) and no red.</p> + + <div class="container"> + <div class="float"> + <div class="block"></div> + </div> + <div class="inline"> + XXXXX + <div class="block"></div> + XXXXX + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-002.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-002.xht new file mode 100644 index 0000000000..ce7f271495 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-002.xht @@ -0,0 +1,44 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> + <head> + <title>CSS Test: Stacking order: Floats and Blocks in Inlines</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/float/stacking/002.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" /> + <link rel="match" href="stack-floats-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style type="text/css"> + /* outer block */ + .container { width: 5em; height: 5em; border: solid; font: 20px/1 Ahem; background: red; display: block; } + .inner { display: block; } + + /* top and bottom */ + .float { width: 5em; height: 3em; margin: 0 0 -5em 0; padding: 1em 0; background: red; float: left; } + .inner .inline { color: lime; display: inline; } + + /* middle */ + .float .block { height: 3em; margin: 0; background: lime; display: block; } + .inner .block { height: 3em; margin: 0; background: red; display: block; } + + </style> + </head> + <body> + <p>Test passes if there is one single filled bright green square (with a black border) and no red.</p> + + <div class="container"> + <div class="float"> + <div class="block"></div> + </div> + <div class="inner"> + <div class="inline">XXXXX</div> + <div class="block"></div> + <div class="inline">XXXXX</div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-003.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-003.xht new file mode 100644 index 0000000000..76f5dba9bd --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-003.xht @@ -0,0 +1,43 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> + <head> + <title>CSS Test: Stacking order: Floats and Blocks in Inlines</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/float/stacking/003.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" /> + <link rel="match" href="stack-floats-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style type="text/css"> + /* outer block */ + .container { width: 5em; height: 5em; border: solid; font: 20px/1 Ahem; background: red; display: block; } + + /* top and bottom */ + .float { width: 5em; height: 3em; margin: -5em 0 0 0; padding: 1em 0; background: red; float: left; } + .inline { color: lime; display: inline; } + + /* middle */ + .float .block { height: 3em; margin: 0; background: lime; display: block; } + .inline .block { height: 3em; margin: 0; background: red; display: block; } + + </style> + </head> + <body> + <p>Test passes if there is one single filled bright green square (with a black border) and no red.</p> + + <div class="container"> + <div class="inline"> + XXXXX + <div class="block"></div> + XXXXX + </div> + <div class="float"> + <div class="block"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-004.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-004.xht new file mode 100644 index 0000000000..6ea4390a52 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-004.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" lang="en"> + <head> + <title>CSS Test: Stacking order: Floats and Blocks in Inlines</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/float/stacking/004.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" /> + <link rel="match" href="stack-floats-001-ref.xht" /> + + <meta content="ahem" name="flags" /> + + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style type="text/css"> + /* outer block */ + .container { width: 5em; height: 5em; border: solid; font: 20px/1 Ahem; background: red; display: block; } + .inner { display: block; } + + /* top and bottom */ + .float { width: 5em; height: 3em; margin: -5em 0 0 0; padding: 1em 0; background: red; float: left; } + .inner .inline { color: lime; display: inline; } + + /* middle */ + .float .block { height: 3em; margin: 0; background: lime; display: block; } + .inner .block { height: 3em; margin: 0; background: red; display: block; } + + </style> + </head> + <body> + <p>Test passes if there is one single filled bright green square (with a black border) and no red.</p> + + <div class="container"> + <div class="inner"> + <div class="inline">XXXXX</div> + <div class="block"></div> + <div class="inline">XXXXX</div> + </div> + <div class="float"> + <div class="block"></div> + </div> + </div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-floats-README b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-README new file mode 100644 index 0000000000..7fcdb89601 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-floats-README @@ -0,0 +1,19 @@ +Tests 001 to 004 are tests of CSS2, section 9.5, normative paragraph 6: + +# A float can overlap other boxes in the normal flow (e.g., when a +# normal flow box next to a float has negative margins). When an +# inline box overlaps with a float, the content, background, and +# borders of the inline box are rendered in front of the float. When a +# block box overlaps, the background and borders of the block box are +# rendered behind the float and are only be visible where the box is +# transparent. The content of the block box is rendered in front of +# the float. + -- http://www.w3.org/TR/REC-CSS2/visuren.html#floats + + +For some of these tests you will need Todd Fahrner's Ahem font, which +you can download from: + + http://www.hixie.ch/resources/fonts/ + +Versions for Mac, Unix and Windows are available. diff --git a/testing/web-platform/tests/css/CSS2/zindex/stack-overflow-001.xht b/testing/web-platform/tests/css/CSS2/zindex/stack-overflow-001.xht new file mode 100644 index 0000000000..774edf1a08 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/stack-overflow-001.xht @@ -0,0 +1,32 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> + <head> + <title>CSS Test: Stacking order and overflow</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/overflow/002.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visufx.html#overflow" /> + <style type="text/css"> + div { border: solid; margin: 1em; height: 5em; width: 5em; } + div p { margin: 0 0 -5em 0; height: 5em; width: 5em; } + .a .before { background: maroon; color: white; } + .a .scroll { background: red; overflow: scroll; } + .a .after { background: lime; } + .b .before { background: maroon; } + .b .scroll { background: red; color: white; overflow: scroll; } + .b .after { background: lime; } + </style> + </head> + <body> + <p>There should be two white-on-green squares below, labelled A and B, with black borders. Scrollbars <em>may</em> be visible if they are visible identically in both cases.</p> + <div class="a"> + <p class="before">A</p> + <p class="scroll"></p> + <p class="after"></p> + </div> + <div class="b"> + <p class="before"></p> + <p class="scroll">B</p> + <p class="after"></p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-green.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-green.png Binary files differnew file mode 100644 index 0000000000..b98ca0ba0a --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-green.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-lime.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-lime.png Binary files differnew file mode 100644 index 0000000000..cb397fb090 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-lime.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-maroon.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-maroon.png Binary files differnew file mode 100644 index 0000000000..3f86b07219 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-maroon.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-navy.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-navy.png Binary files differnew file mode 100644 index 0000000000..9b9a03955b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-navy.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-red.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-red.png Binary files differnew file mode 100644 index 0000000000..6bd73ac101 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-red.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/1x1-white.png b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-white.png Binary files differnew file mode 100644 index 0000000000..dd43faec54 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/1x1-white.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/60x60-gg-rr.png b/testing/web-platform/tests/css/CSS2/zindex/support/60x60-gg-rr.png Binary files differnew file mode 100644 index 0000000000..84f5b2a4f1 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/60x60-gg-rr.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/60x60-green.png b/testing/web-platform/tests/css/CSS2/zindex/support/60x60-green.png Binary files differnew file mode 100644 index 0000000000..b3c8cf3eb4 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/60x60-green.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/a-green.css b/testing/web-platform/tests/css/CSS2/zindex/support/a-green.css new file mode 100644 index 0000000000..b0dbb071d5 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/a-green.css @@ -0,0 +1 @@ +.a { color: green; } diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/b-green.css b/testing/web-platform/tests/css/CSS2/zindex/support/b-green.css new file mode 100644 index 0000000000..a0473f5ca2 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/b-green.css @@ -0,0 +1 @@ +.b { color: green; }
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/blue15x15.png b/testing/web-platform/tests/css/CSS2/zindex/support/blue15x15.png Binary files differnew file mode 100644 index 0000000000..89de32fdb8 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/blue15x15.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/c-red.css b/testing/web-platform/tests/css/CSS2/zindex/support/c-red.css new file mode 100644 index 0000000000..d4ba5c64e9 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/c-red.css @@ -0,0 +1 @@ +.c { color: red; }
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/cat.png b/testing/web-platform/tests/css/CSS2/zindex/support/cat.png Binary files differnew file mode 100644 index 0000000000..85dd732481 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/cat.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/diamond.png b/testing/web-platform/tests/css/CSS2/zindex/support/diamond.png Binary files differnew file mode 100644 index 0000000000..51112efc7c --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/diamond.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/green15x15.png b/testing/web-platform/tests/css/CSS2/zindex/support/green15x15.png Binary files differnew file mode 100644 index 0000000000..51741584a0 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/green15x15.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rgr-grg.png b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rgr-grg.png Binary files differnew file mode 100644 index 0000000000..9b88fbd811 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rgr-grg.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rrg-rgg.png b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rrg-rgg.png Binary files differnew file mode 100644 index 0000000000..fcf4f3fd7d --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-grg-rrg-rgg.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/pattern-rgr-grg-rgr.png b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-rgr-grg-rgr.png Binary files differnew file mode 100644 index 0000000000..d454e3a630 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-rgr-grg-rgr.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/pattern-tr.png b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-tr.png Binary files differnew file mode 100644 index 0000000000..8b4b25364e --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/pattern-tr.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/ring.png b/testing/web-platform/tests/css/CSS2/zindex/support/ring.png Binary files differnew file mode 100644 index 0000000000..061bb94eba --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/ring.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/square-purple.png b/testing/web-platform/tests/css/CSS2/zindex/support/square-purple.png Binary files differnew file mode 100644 index 0000000000..0f522d7872 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/square-purple.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/square-teal.png b/testing/web-platform/tests/css/CSS2/zindex/support/square-teal.png Binary files differnew file mode 100644 index 0000000000..e567f51b91 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/square-teal.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/square-white.png b/testing/web-platform/tests/css/CSS2/zindex/support/square-white.png Binary files differnew file mode 100644 index 0000000000..5853cbb238 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/square-white.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-blue.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-blue.png Binary files differnew file mode 100644 index 0000000000..bf2759634d --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-blue.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-green.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-green.png Binary files differnew file mode 100644 index 0000000000..0aa79b0c86 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-green.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-lime.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-lime.png Binary files differnew file mode 100644 index 0000000000..55fd7fdaed --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-lime.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-orange.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-orange.png Binary files differnew file mode 100644 index 0000000000..d3cd498b52 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-orange.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-red.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-red.png Binary files differnew file mode 100644 index 0000000000..1caf25c992 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-red.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-white.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-white.png Binary files differnew file mode 100644 index 0000000000..1a7d4323d7 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-white.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/swatch-yellow.png b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-yellow.png Binary files differnew file mode 100644 index 0000000000..1591aa0e2e --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/swatch-yellow.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/test-bl.png b/testing/web-platform/tests/css/CSS2/zindex/support/test-bl.png Binary files differnew file mode 100644 index 0000000000..904e24e996 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/test-bl.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/test-br.png b/testing/web-platform/tests/css/CSS2/zindex/support/test-br.png Binary files differnew file mode 100644 index 0000000000..f413ff5c1a --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/test-br.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/test-outer.png b/testing/web-platform/tests/css/CSS2/zindex/support/test-outer.png Binary files differnew file mode 100644 index 0000000000..82eeace7fc --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/test-outer.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/test-tl.png b/testing/web-platform/tests/css/CSS2/zindex/support/test-tl.png Binary files differnew file mode 100644 index 0000000000..f6ac0ef7e8 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/test-tl.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/support/test-tr.png b/testing/web-platform/tests/css/CSS2/zindex/support/test-tr.png Binary files differnew file mode 100644 index 0000000000..59843ae54b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/support/test-tr.png diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-001.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-001.xht new file mode 100644 index 0000000000..3e5093744a --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-001.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to minimum value minus 1</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a minimum value minus 1 for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -100; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -2147483649; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-002.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-002.xht new file mode 100644 index 0000000000..7173f03979 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-002.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to minimum value</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a minimum value for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -100; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -2147483648; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-003.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-003.xht new file mode 100644 index 0000000000..f3c56c914c --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-003.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 Test: Z-index set to minimum value plus 1</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a minimum value plus 1 for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -100; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -2147483647; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-004.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-004.xht new file mode 100644 index 0000000000..324b3c8ecf --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-004.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to zero prefixed with a minus sign</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to '0' prefixed with a minus sign is read as value '0'." /> + <style type="text/css"> + #div1 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -0; + } + #div2 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-005.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-005.xht new file mode 100644 index 0000000000..9837075e0e --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-005.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 Test: Z-index set to zero</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index with a zero value is read and applied as the value '0'." /> + <style type="text/css"> + #div1 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 0; + } + #div2 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-006.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-006.xht new file mode 100644 index 0000000000..0fb1bccbef --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-006.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 Test: Z-index set to zero prefixed with a plus sign</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to '0' prefixed with a plus sign is read as value '0'." /> + <style type="text/css"> + #div1 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: +0; + } + #div2 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-007.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-007.xht new file mode 100644 index 0000000000..b32ab88a10 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-007.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to a nominal value</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to a nominal value is correctly read and applied." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 5; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-008.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-008.xht new file mode 100644 index 0000000000..acda953421 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-008.xht @@ -0,0 +1,45 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to a nominal value prefixed with a plus sign</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to nominal value and prefixed with a plus sign is read the same as the value without the plus sign." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: +5; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-009.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-009.xht new file mode 100644 index 0000000000..785f2d3e3d --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-009.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 Test: Z-index set maximum value minus 1</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a maximum value minus 1 for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 2147483646; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 100; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-010.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-010.xht new file mode 100644 index 0000000000..a9e3bd2c3b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-010.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 Test: Z-index set to the maximum value</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a maximum value for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 2147483647; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 100; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-011.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-011.xht new file mode 100644 index 0000000000..5e97edc52c --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-011.xht @@ -0,0 +1,47 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index set to maximum value prefixed with a plus sign</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property z-index set to a maximum value for a 32-bit integer, prefixed with a plus sign is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: +2147483647; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 100; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-012.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-012.xht new file mode 100644 index 0000000000..3a8ff84e14 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-012.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 Test: Z-index set to maximum value plus 1</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="flags" content="32bit may" /> + <meta name="assert" content="The property 'z-index' set to a maximum value plus 1 for a 32-bit integer is correctly handled." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 2147483648; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: 100; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-013.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-013.xht new file mode 100644 index 0000000000..63e8ef1f9b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-013.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 Test: Z-index: auto results in the same stack level as parent element</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to 'auto' results in the same stacking level as its parent element." /> + <style type="text/css"> + #div1 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: auto; + } + #div2 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-014.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-014.xht new file mode 100644 index 0000000000..c8b80a52e0 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-014.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 Test: Z-index: inherit sets a value the same as parent element's value</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta name="assert" content="The property z-index set to 'inherit' sets a value the same as parent element's computed value." /> + <style type="text/css"> + #div1 + { + background: green; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + z-index: -1; + z-index: inherit; + } + #div2 + { + background: red; + height: 100px; + left: 0; + position: absolute; + top: 0; + width: 100px; + } + #wrapper + { + position: relative; + z-index: 1; + } + </style> + </head> + <body> + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + <div id="wrapper"> + <div id="div1"></div> + <div id="div2"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-015.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-015.xht new file mode 100644 index 0000000000..e02ff50019 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-015.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 Test: z-index - integer value</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="author" title="James Hopkins" href="http://idreamincode.co.uk/css21testsuite" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#numbers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta content="invalid" name="flags" /> + <meta content="Besides 'auto' and 'inherit' keyword values, z-index property can only accept an integer value. An integer consists of one or more digits '0' to '9'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 100px; + position: absolute; + width: 100px; + } + + #invalid-zindex + { + background-color: red; + z-index: 2.5; + } + + #valid-zindex + { + background-color: green; + z-index: auto; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="invalid-zindex"></div> + + <div id="valid-zindex"></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-016.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-016.xht new file mode 100644 index 0000000000..1ca51726af --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-016.xht @@ -0,0 +1,51 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <title>CSS Test: z-index - integer value</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="author" title="James Hopkins" href="http://idreamincode.co.uk/css21testsuite" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#numbers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta content="invalid" name="flags" /> + <meta content="Besides 'auto' and 'inherit' keyword values, z-index property can only accept an integer value. An integer consists of one or more digits '0' to '9'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 100px; + position: absolute; + width: 100px; + } + + #invalid-zindex + { + background-color: red; + z-index: 2.0; + } + + #valid-zindex + { + background-color: green; + z-index: auto; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="invalid-zindex"></div> + + <div id="valid-zindex"></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-017.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-017.xht new file mode 100644 index 0000000000..245204e80f --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-017.xht @@ -0,0 +1,51 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <title>CSS Test: z-index - integer value</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="author" title="James Hopkins" href="http://idreamincode.co.uk/css21testsuite" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#numbers" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#parsing-errors" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta content="invalid" name="flags" /> + <meta content="Besides 'auto' and 'inherit' keyword values, z-index property can only accept an integer value. An integer consists of one or more digits '0' to '9'." name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 100px; + position: absolute; + width: 100px; + } + + #invalid-zindex + { + background-color: red; + z-index: 100%; + } + + #valid-zindex + { + background-color: green; + z-index: auto; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="invalid-zindex"></div> + + <div id="valid-zindex"></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-018.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-018.xht new file mode 100644 index 0000000000..f090267626 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-018.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 Test: z-index - negative values</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#numbers" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta content="32bit" name="flags" /> + <meta content="Integers should range from -2,147,483,648 to 2,147,483,647 according to C Language Specification" name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 100px; + position: absolute; + width: 100px; + } + + #very-deep + { + background-color: red; + z-index: -2147483646; + } + + #just-under-surface + { + background-color: green; + z-index: -1; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="just-under-surface"></div> + + <div id="very-deep"></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-019.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-019.xht new file mode 100644 index 0000000000..51678a7e0f --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-019.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 Test: z-index - negative values</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#numbers" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + + <meta content="32bit" name="flags" /> + <meta content="Integers should range from -2,147,483,648 to 2,147,483,647 according to C Language Specification" name="assert" /> + + <style type="text/css"><![CDATA[ + div + { + height: 100px; + position: absolute; + width: 100px; + } + + #very-deep + { + background-color: red; + z-index: -2147483646; + } + + #at-surface + { + background-color: green; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div id="at-surface"></div> + + <div id="very-deep"></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001-ref.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001-ref.xht new file mode 100644 index 0000000000..a225a48f42 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001-ref.xht @@ -0,0 +1,29 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <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: 150px; + width: 400px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + + <div></div> + + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001.xht new file mode 100644 index 0000000000..63a44d15a7 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-001.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index auto, -1 and backgrounds (child)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/001.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .background { position: absolute; height: 150px; width: 400px; background: green; z-index: auto; } + .negative { position: absolute; height: 100px; width: 300px; background: red; z-index: -1; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="background"> <div class="negative"> </div> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-002.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-002.xht new file mode 100644 index 0000000000..2c5ab971bf --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-002.xht @@ -0,0 +1,22 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index auto and -1 (siblings)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/002.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .background { position: absolute; height: 150px; width: 400px; background: green; z-index: auto; } + .negative { position: absolute; height: 100px; width: 300px; background: red; z-index: -1; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="background"> </div> + <div class="negative"> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-003.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-003.xht new file mode 100644 index 0000000000..3e46ee2ca8 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-003.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index 0, -1 and backgrounds (child)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/003.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .background { position: absolute; height: 100px; width: 300px; background: red; z-index: 0; } + .negative { position: absolute; height: 150px; width: 400px; background: green; z-index: -1; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="background"> <div class="negative"> </div> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-004.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-004.xht new file mode 100644 index 0000000000..b2cc25905a --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-004.xht @@ -0,0 +1,22 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index auto and 0 (siblings)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/004.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .auto { position: absolute; height: 100px; width: 300px; background: red; z-index: auto; } + .zero { position: absolute; height: 150px; width: 400px; background: green; z-index: 0; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="auto"> </div> + <div class="zero"> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-005.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-005.xht new file mode 100644 index 0000000000..c93feabd98 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-005.xht @@ -0,0 +1,22 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index auto and 0 (siblings)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/005.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .zero { position: absolute; height: 100px; width: 300px; background: red; z-index: 0; } + .auto { position: absolute; height: 150px; width: 400px; background: green; z-index: auto; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="zero"> </div> + <div class="auto"> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-006.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-006.xht new file mode 100644 index 0000000000..6d3c39b1b5 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-006.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index and SELECT elements</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/006.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <style type="text/css"> + * { font: 1em serif; } + .a { position: absolute; z-index: 2; top: 2em; left: 2em; width: 13em; background: green; color: white; padding: 1em; } + .b { position: absolute; z-index: 1; top: 2.5em; left: 2.5em; background: red; color: yellow; height: 3em; } + </style> + </head> + <body> + <div class="test a"> There should be no red, nor any scroll bars, on this page. </div> + <select class="test b" size="3"> + <option>FAIL FAIL FAIL FAIL</option> + <option>FAIL FAIL FAIL FAIL</option> + <option>FAIL FAIL FAIL FAIL</option> + </select> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-007.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-007.xht new file mode 100644 index 0000000000..f9dcdc397c --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-007.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index 1, -1 and backgrounds (child)</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/007.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <link rel="match" href="z-index-abspos-001-ref.xht" /> + + <style type="text/css"> + .background { position: absolute; height: 100px; width: 300px; background: red; z-index: 1; } + .negative { position: absolute; height: 150px; width: 400px; background: green; z-index: -1; } + </style> + </head> + <body> + <p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p> + <div class="background"> <div class="negative"> </div> </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-008.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-008.xht new file mode 100644 index 0000000000..d87fab3e5b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-008.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: z-index</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> <!-- 2012-07-03 --> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/008.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + + <style type="text/css"> + div { position: absolute; width: 4em; height: 4em; } + .a { top: 1em; left: 1em; width: 12em; height: 12em; background: gray; } + .b { top: 1em; left: 4em; background: blue; } + .d { top: 4em; left: 7em; background: orange; } + .e { top: 3em; left: -3em; background: yellow; z-index: 1; } + .c { top: 3em; left: -3em; background: lime; z-index: 2; } + .text { top: 14em; width: 30em; } + </style> + </head> + <body> + <div class="a"> + <div class="b"> + <div class="c"> + </div> + </div> + <div class="d"> + <div class="e"> + </div> + </div> + </div> + <div class="text">The squares should overlap each other clockwise, so that the + top one (blue) is the bottommost and the one to its left (green) is the + topmost.</div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-009.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-009.xht new file mode 100644 index 0000000000..a53d686e10 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-abspos-009.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 lang="en" xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: CSS: z-index and the canvas and background propagation</title> + <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> + <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> + <link rel="alternate" href="http://www.hixie.ch/tests/adhoc/css/box/absolute/z-index/canvas/001.html" type="text/html"/> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/zindex.html#painting-order"/> + <style type="text/css"> + * { background: transparent; margin: 0; } + html { margin: 5em auto; + height: 35px; width: 35px; + border: solid 10px red; + background: transparent; } + body { background: transparent url(support/swatch-red.png) no-repeat center; + height: 15px; width: 15px; + border: 10px solid green; } + div { background: red url(support/swatch-green.png) center no-repeat; + height: 15px; width: 15px; padding: 9px; + border: solid 10px green; + position: absolute; margin-top: -19px; margin-left: -19px; z-index: -1; } + p { position: absolute; top: 0; left: 0; margin: 1em; } + </style> + </head> + <body> + <p>There should be a completely-filled green square and no red.</p> + <!-- + + The <div> should be under the <body> box but above the canvas and <html> + backdrop. + + !--> + <div></div> + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-001.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-001.xht new file mode 100644 index 0000000000..54d1a06cf0 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-row-group'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-row-group'." /> + <style type="text/css"> + #test + { + background: green; + display: table-row-group; + z-index: 1; + } + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + position: relative; + } + #cell, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-002.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-002.xht new file mode 100644 index 0000000000..8b2a1eb03f --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-002.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-header-group'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-header-group'." /> + <style type="text/css"> + #test + { + background: green; + display: table-header-group; + z-index: 1; + } + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + position: relative; + } + #cell, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-003.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-003.xht new file mode 100644 index 0000000000..d2cbda1d18 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-003.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-footer-group'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-footer-group'." /> + <style type="text/css"> + #test + { + background: green; + display: table-footer-group; + z-index: 1; + } + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + position: relative; + } + #cell, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-004.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-004.xht new file mode 100644 index 0000000000..36f81643df --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-004.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 Test: Z-index applied to element with 'display' set to 'table-row'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-row'." /> + <style type="text/css"> + #table + { + display: table; + table-layout: fixed; + } + #row + { + background: green; + display: table-row; + z-index: 1; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #row, #zindex + { + position: relative; + } + #cell, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-005.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-005.xht new file mode 100644 index 0000000000..8c90bac12b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-005.xht @@ -0,0 +1,56 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-column-group'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-column-group'." /> + <style type="text/css"> + #test + { + background: green; + display: table-column-group; + z-index: 1; + } + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + position: relative; + } + #cell, #test, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"></div> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-006.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-006.xht new file mode 100644 index 0000000000..2bd33f98af --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-006.xht @@ -0,0 +1,56 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-column'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-column'." /> + <style type="text/css"> + #test + { + background: green; + display: table-column; + z-index: 1; + } + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + position: relative; + } + #cell, #test, #zindex + { + height: 1in; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"></div> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-007.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-007.xht new file mode 100644 index 0000000000..da754dde54 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-007.xht @@ -0,0 +1,48 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-cell'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-cell'." /> + <style type="text/css"> + #table + { + display: table; + table-layout: fixed; + } + #row + { + display: table-row; + } + #cell + { + background: green; + display: table-cell; + z-index: 1; + } + #zindex + { + background: yellow; + top: -1in; + } + #cell, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-008.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-008.xht new file mode 100644 index 0000000000..34f26df7ec --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-008.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 Test: Z-index applied to element with 'display' set to inline</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="ahem" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of inline." /> + <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> + <style type="text/css"> + div + { + display: inline; + font: 20px/1em Ahem; + position: relative; + } + #div1 + { + background: green; + color: green; + } + #zindex + { + background: red; + color: red; + left: -5em; + z-index: -1; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page.</p> + <div id="div1">XXXXX</div><div id="zindex">XXXXX</div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-009.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-009.xht new file mode 100644 index 0000000000..987560f933 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-009.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 Test: Z-index applied to element with 'display' set to block</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of block." /> + <style type="text/css"> + span + { + background: green; + display: block; + z-index: 1; + } + #zindex + { + background: red; + top: -1in; + } + span, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page.</p> + <div> + <span></span> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-010.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-010.xht new file mode 100644 index 0000000000..848aa765cf --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-010.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 Test: Z-index applied to element with 'display' set to list-item</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of list-item." /> + <style type="text/css"> + body + { + margin-left: 1em; + } + #div1 + { + background: green; + display: list-item; + z-index: 1; + } + #zindex + { + background: red; + top: -1in; + } + #div1, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page and there is a marker bullet on the left-hand side of the box.</p> + <div id="div1"></div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-012.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-012.xht new file mode 100644 index 0000000000..51b949597b --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-012.xht @@ -0,0 +1,40 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to inline-block</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of inline-block." /> + <style type="text/css"> + div + { + line-height: 0; + } + #div1 + { + background: green; + display: inline-block; + z-index: 1; + } + #zindex + { + background: red; + top: -1in; + } + #div1, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page.</p> + <div> + <div id="div1"></div> + <div id="zindex"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-013.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-013.xht new file mode 100644 index 0000000000..a3e0ce15f7 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-013.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 Test: Z-index applied to element with 'display' set to 'table'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of 'table'." /> + <style type="text/css"> + #table + { + background: green; + display: table; + table-layout: fixed; + z-index: 1; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: red; + top: -1in; + } + #table, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page.</p> + <div id="table"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-014.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-014.xht new file mode 100644 index 0000000000..991a1cdd39 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-014.xht @@ -0,0 +1,53 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'inline-table'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="assert" content="The 'z-index' property applies to elements with a display of 'inline-table'." /> + <style type="text/css"> + div + { + line-height: 0; + } + #table + { + background: green; + display: inline-table; + table-layout: fixed; + z-index: 1; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: red; + top: -1in; + } + #table, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is no red visible on the page.</p> + <div> + <div id="table"> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-015.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-015.xht new file mode 100644 index 0000000000..cb35775000 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-applies-to-015.xht @@ -0,0 +1,52 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index applied to element with 'display' set to 'table-caption'</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta name="flags" content="may" /> + <meta name="assert" content="The 'z-index' property can apply to elements with a display of 'table-caption'." /> + <style type="text/css"> + #test + { + background: green; + display: table-caption; + z-index: 1; + } + #table + { + display: table; + } + #row + { + display: table-row; + } + #cell + { + display: table-cell; + } + #zindex + { + background: yellow; + top: -1in; + } + #test, #zindex + { + height: 1in; + position: relative; + width: 1in; + } + </style> + </head> + <body> + <p>Test passes if there is a green or yellow box below.</p> + <div id="table"> + <div id="test"></div> + <div id="row"> + <div id="cell"></div> + </div> + </div> + <div id="zindex"></div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-dynamic-001.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-dynamic-001.xht new file mode 100644 index 0000000000..9c4ca593e7 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-dynamic-001.xht @@ -0,0 +1,57 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <title>CSS Test: Z-index - dynamically setting z-index to bring an element from back to in front of</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="Section 9.9.1 Specifying the stack level: the 'z-index' property" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <link rel="match" href="../reference/ref-filled-green-100px-square.xht" /> + <meta http-equiv="Content-Script-Type" content="text/javascript" /> + <meta content="dom" name="flags" /> + <meta content="Setting the 'z-index' property of a positioned element can bring it from behind the surface on a lower stack level to a greater stack level passing it in front of another element painted on the surface." name="assert" /> + + <style type="text/css"><![CDATA[ + #test + { + background-color: green; + display: block; + z-index: -1; + } + + #red-layer + { + background-color: red; + top: -100px; + z-index: auto; + } + + #test, #red-layer + { + height: 100px; + position: relative; + width: 100px; + } + ]]></style> + + <script type="text/javascript"><![CDATA[ + function fromBottomToTopOfStack() + { + document.getElementById("test").style.zIndex = 1; + } + ]]></script> + + </head> + + <body onload="fromBottomToTopOfStack();"> + + <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> + + <div><span id="test"></span></div> + + <div id="red-layer"></div> + + </body> +</html> diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-001.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-001.xht new file mode 100644 index 0000000000..3a4587e2c3 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-001.xht @@ -0,0 +1,50 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Test: Z-index and stacking levels</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <meta name="assert" content="Boxes with greater stack levels are always formatted in front of boxes with lower stack levels." /> + <style type="text/css"> + #div1 + { + position: relative; + } + div div + { + height: 1in; + position: absolute; + width: 1in; + } + #div2 + { + background: orange; + left: 30px; + top: 30px; + z-index: 2; + } + #div3 + { + background: yellow; + left: 60px; + top: 60px; + z-index: 3; + } + #div4 + { + background: blue; + left: 0; + top: 0; + z-index: 1; + } + </style> + </head> + <body> + <p>Test passes if the boxes are partially stacked on top of each other, and they are stacked in the following order from bottom to top: blue, orange, yellow.</p> + <div id="div1"> + <div id="div2"></div> + <div id="div3"></div> + <div id="div4"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-002.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-002.xht new file mode 100644 index 0000000000..a1be7e264e --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-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 Test: Z-index and similar stacking levels</title> + <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> + <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#layers" /> + <meta name="assert" content="Boxes with the same stack level in a stacking context are stacked back-to-front according to document tree order." /> + <style type="text/css"> + #div1 + { + position: relative; + } + div div + { + height: 1in; + position: absolute; + width: 1in; + } + #div2 + { + background: blue; + left: 0; + top: 0; + z-index: 1; + } + #div3 + { + background: orange; + left: 30px; + top: 30px; + z-index: 1; + } + #div4 + { + background: yellow; + left: 60px; + top: 60px; + z-index: 1; + } + </style> + </head> + <body> + <p>Test passes if the boxes are partially stacked on top of each other, and they are stacked in the following order from bottom to top: blue, orange, yellow.</p> + <div id="div1"> + <div id="div2"></div> + <div id="div3"></div> + <div id="div4"></div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-003.xht b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-003.xht new file mode 100644 index 0000000000..c09ff7f284 --- /dev/null +++ b/testing/web-platform/tests/css/CSS2/zindex/z-index-stack-003.xht @@ -0,0 +1,59 @@ +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> + +<html xmlns="http://www.w3.org/1999/xhtml"> + + <head> + + <title>CSS Test: Z-index - stacking levels of positioned elements versus floated elements</title> + + <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> + <link rel="help" title="Section 9.9.1 Specifying the stack level: the 'z-index' property" href="http://www.w3.org/TR/CSS21/visuren.html#z-index" /> + <meta content="Positioned elements should be painted over floated elements. A positioned descendant with 'z-index: auto' has a greater stacking level than non-positioned floated elements." name="assert" /> + + <style type="text/css"><![CDATA[ + #rel-pos-containing-block {position: relative;} + + #yellow-overlapping-abs-pos + { + background-color: yellow; + height: 100px; + left: 60px; + position: absolute; + top: 60px; + width: 100px; + z-index: auto; + } + + #blue-first-float + { + background-color: blue; + float: left; + height: 100px; + width: 100px; + } + + #orange-second-float + { + background-color: orange; + float: left; + height: 100px; + margin-left: -70px; + margin-top: 30px; + width: 100px; + } + ]]></style> + + </head> + + <body> + + <p>Test passes if the boxes are partially stacked on top of each other and if they are stacked in the following order <strong>from bottom to top: blue, orange, yellow</strong>.</p> + + <div id="rel-pos-containing-block"> + <div id="yellow-overlapping-abs-pos"></div> + <div id="blue-first-float"></div> + <div id="orange-second-float"></div> + </div> + + </body> +</html>
\ No newline at end of file |
