Update CSS tests to revision 31d63cc79bd4c929ed582229e936d7b389f3e6ab

This commit is contained in:
James Graham
2015-03-27 09:18:12 +00:00
parent 1a81b18b9f
commit 2c9faf5363
91915 changed files with 5979820 additions and 0 deletions

View File

@@ -0,0 +1,10 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>CSS Reftest Reference: 60px by 60px green box</title>
<link href="http://www.google.com/" rel="author" title="Google">
</head>
<body>
<div style="width: 60px; height: 60px; background: green;"><br></div>
</body></html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if a filled blue square is in the <strong>upper-left corner</strong> of an hollow black square and if there is <strong>no red</strong>.</p>
<div><img src="support/blue15x15.png" width="100" height="100" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
height: 96px;
vertical-align: top;
width: 100%;
}
</style>
</head>
<body>
<p>Test passes if a blue rectangle is <strong>vertically centered</strong> in an hollow black square.</p>
<div><img src="support/1x1-white.png" alt="Image download support must be enabled"><img src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid 10px;
height: 300px;
width: 300px;
}
img
{
height: 100px;
vertical-align: top;
width: 100%;
}
img + img {height: 150px;}
</style>
</head>
<body>
<p>Test passes if there is one and only one blue rectangle inside an hollow black square and if such black square does not have a vertical scrollbar.</p>
<div><img src="support/1x1-white.png" alt="Image download support must be enabled"><img src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
img
{
height: 100px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if the orange and blue squares have the <strong>same height</strong>.</p>
<div><img src="support/swatch-orange.png" alt="Image download support must be enabled"><img src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
img
{
height: 96px;
vertical-align: top;
width: 96px;
}
img#blue
{
height: 192px;
}
</style>
</head>
<body>
<p>Test passes if a blue rectangle is below an orange square.</p>
<div><img src="support/swatch-orange.png" alt="Image download support must be enabled"><br><img id="blue" src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {margin-top: 41px;}
img
{
height: 100px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if the orange and blue squares have the <strong>same height</strong>.</p>
<div><img src="support/swatch-orange.png" alt="Image download support must be enabled"><img src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
width: 200px;
}
img {padding-left: 100px;}
</style>
</head>
<body>
<p>Test passes if there is a blue rectangle in the <strong>upper-right corner</strong> of an hollow black square.</p>
<div><img src="support/blue15x15.png" width="100" height="50" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img {padding-top: 120px;}
</style>
</head>
<body>
<p>Test passes if a blue rectangle is <strong>vertically centered</strong> in an hollow black square.</p>
<div><img src="support/blue15x15.png" width="288" height="48" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,25 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {margin-top: 66px;}
img {vertical-align: top;}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the <strong>same height</strong>.</p>
<div><img src="support/blue15x15.png" width="50" height="50" alt="Image download support must be enabled"><img src="support/swatch-orange.png" width="50" height="50" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
img {vertical-align: top;}
</style>
</head>
<body>
<p>Test passes if there is a small orange rectangle and a bigger blue rectangle.</p>
<div><img src="support/swatch-orange.png" width="96" height="48" alt="Image download support must be enabled"><br><img src="support/blue15x15.png" width="96" height="240" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,25 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {margin-top: 41px;}
img {vertical-align: top;}
</style>
</head>
<body>
<p>Test passes if the orange and blue rectangles have the <strong>same height</strong>.</p>
<div><img src="support/swatch-orange.png" width="100" height="50" alt="Image download support must be enabled"><img src="support/blue15x15.png" width="100" height="50" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
padding-left: 100px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if a filled blue square is in the <strong>upper-right corner</strong> of an hollow black square and if there is <strong>no red</strong>.</p>
<div><img src="support/blue15x15.png" width="100" height="100" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
padding-left: 300px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if a filled blue square is in the <strong>upper-right corner</strong> of an hollow black rectangle and if there is <strong>no red</strong>.</p>
<div><img src="support/blue15x15.png" width="100" height="100" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if a filled blue square is in the <strong>upper-left corner</strong> of an hollow black rectangle and if there is <strong>no red</strong>.</p>
<div><img src="support/blue15x15.png" width="100" height="100" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 200px;
text-align: center;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if a filled blue square is <strong>horizontally centered</strong> inside an hollow black rectangle and if there is <strong>no red</strong>.</p>
<div><img src="support/blue15x15.png" width="100" height="100" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,40 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="author" title="Daniel Schattenkirchner" href="crazy-daniel{at}gmx.de">
<style type="text/css">
div.green-45x120
{
background-color: green;
height: 45px;
width: 120px;
}
div#black-stripe
{
background-color: black;
height: 30px;
width: 240px;
}
</style>
</head>
<body>
<p>Below there should be a green square. In the middle of such green square, a black horizontal stripe should be traversing it and protruding out of it toward the right. There should be no red in this page.</p>
<div class="green-45x120"></div>
<div id="black-stripe"></div>
<div class="green-45x120"></div>
</body>
</html>

View File

@@ -0,0 +1,42 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="author" title="Daniel Schattenkirchner" href="crazy-daniel{at}gmx.de">
<style type="text/css">
div.green-45x120
{
background-color: green;
height: 45px;
margin-left: auto;
width: 120px;
}
div#black-stripe
{
background-color: black;
height: 30px;
margin-left: auto;
width: 240px;
}
</style>
</head>
<body>
<p>Below, on the right edge of the page, there should be a green square. In the middle of such green square, a black horizontal stripe should be traversing it and protruding out of it toward the left. There should be no red in this page.</p>
<div class="green-45x120"></div>
<div id="black-stripe"></div>
<div class="green-45x120"></div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 8px;}
div
{
background-color: green;
height: 100px;
margin: 0px auto;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if there is a green square <strong>horizontally centered</strong> in the page and if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,32 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 8px;}
div
{
background-color: green;
height: 100px;
margin-left: auto;
margin-right: 0px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if there is a green square on the <strong>right side</strong> of this page and if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border-bottom: orange solid medium;
border-top: orange solid medium;
height: 15px;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no space between</strong> the blue square and the orange lines.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if the blue and orange squares have the <strong>same height</strong>.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
height: 150px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
height: 96px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
img
{
height: 96px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the <strong>same height</strong>.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border-top: black solid medium;
margin-bottom: 96px;
}
div + div
{
background-color: blue;
border-top: none 0px;
height: 15px;
width: 30px;
}
</style>
</head>
<body>
<p>Test passes if there is a short blue bar and it does not touch the black line.</p>
<div></div>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border-top: black solid medium;
margin-bottom: 96px;
}
div + div
{
background-color: blue;
border-top: none 0px;
height: 96px;
width: 192px;
}
</style>
</head>
<body>
<p>Test passes if there is a filled blue rectangle and it does not touch the black line.</p>
<div></div>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
height: 150px;
margin-top: 112px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
height: 96px;
margin-top: 112px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border-top: black solid medium;
margin-bottom: 96px;
}
div + div {border: none 0px;}
img
{
height: 96px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles are next to each other, have the same height and are not touching the black line.</p>
<div></div>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: green solid medium;
margin-top: 112px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 192px;
width: 192px;
}
img {display: block;}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-left corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 50px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-left corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 100px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-left corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
height: 150px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is a filled green rectangle and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
height: 150px;
width: 150px;
}
</style>
</head>
<body>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
height: 300px;
width: 300px;
}
</style>
</head>
<body>
<p>Test passes if there is a big filled green square and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,38 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 100px;
margin-bottom: 10px;
width: 200px;
}
img + img {height: 96px;}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-left corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 192px;
}
img
{
display: block;
height: 96px;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-left corner of an hollow black rectangle.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 192px;
width: 192px;
}
img
{
display: block;
position: relative;
left: 177px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-right corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 192px;
}
img
{
display: block;
height: 96px;
left: 96px;
position: relative;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-right corner of an hollow black rectangle.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 192px;
width: 192px;
}
img
{
display: block;
height: 96px;
left: 96px;
position: relative;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-right corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 296px;
width: 296px;
}
img
{
display: block;
height: 50px;
padding-left: 96px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-right corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 100px;
padding-left: 88px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-right corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 100px;
margin-bottom: 10px;
padding-left: 88px;
width: 200px;
}
img + img {height: 96px;}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and the blue rectangle is in the upper-right corner of an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 192px;
}
img
{
display: block;
height: 96px;
padding-left: 96px;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and the blue square is in the upper-left corner of an hollow black rectangle.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 192px;
width: 192px;
}
img
{
display: block;
height: 96px;
margin-left: 0.5in;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and are <strong>horizontally centered</strong> in an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 50px;
margin-left: 44px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and are <strong>horizontally centered</strong> in an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
padding-left: 44px;
height: 100px;
width: 200px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and are <strong>horizontally centered</strong> in an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 288px;
}
img
{
display: block;
height: 100px;
margin-bottom: 10px;
padding-left: 44px;
width: 200px;
}
img + img {height: 96px;}
</style>
</head>
<body>
<p>Test passes if the blue and orange rectangles have the same width and are <strong>horizontally centered</strong> in an hollow black square.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: black solid medium;
height: 288px;
width: 192px;
}
img
{
display: block;
padding-left: 48px;
height: 96px;
width: 96px;
}
</style>
</head>
<body>
<p>Test passes if the blue and orange squares have the same width and are <strong>horizontally centered</strong> in an hollow black rectangle.</p>
<div><img src="support/blue15x15.png" alt="Image download support must be enabled"><img src="support/swatch-orange.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,25 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 1em;}
p {padding-bottom: 1em;}
</style>
</head>
<body>
<p>Test passes if there is a green stripe and no red.</p>
<div><img src="support/swatch-green.png" width="160" height="16" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
border: blue solid 16px;
height: 32px;
width: 64px;
}
</style>
</head>
<body>
<p>Test passes if there is a hollow blue rectangle.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
p {margin: 0;}
div
{
background-color: green;
height: 1em;
width: 10em;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
border-top: white solid 10px;
color: white;
float: left;
font-size: 100px;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div>X X0</div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
float: right;
height: 1em;
width: 10em;
}
</style>
</head>
<body>
<p>Test passes if there is a green stripe on the right and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,41 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 8px;}
div {font: bold 32px/1 monospace;}
div#first {margin-top: 40px;}
div#second
{
bottom: 1em;
position: relative;
}
div#third
{
bottom: 2em;
position: relative;
}
</style>
</head>
<body>
<div id="first">____ ____</div>
<div id="second">FAIL PASS</div>
<div id="third">####</div>
</body>
</html>

View File

@@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 10px;}
div
{
background-color: green;
color: white;
height: 64px;
width: 320px;
}
</style>
</head>
<body>
<div>This block should be green.</div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
p, div {text-align: right;}
</style>
</head>
<body>
<p>.Test passes if there is a green stripe on the right and <strong>no red</strong></p>
<div><img src="support/1x1-green.png" width="64" height="16" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 8px; font: 1em/1.25 serif;}
strong {line-height: 1;}
img
{
left: 56px;
position: relative;
top: 12px;
vertical-align: top;
}
</style>
</head>
<body>
<p>Test passes if there is a green square and <strong>no red</strong>.</p>
<div><img src="support/swatch-green.png" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
height: 1em;
width: 6em;
}
</style>
</head>
<body>
<p>Test passes if there is a green stripe and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 0;}
div {color: green;}
</style>
</head>
<body>
<div>Test passes if there is <strong>no red</strong>.</div>
</body>
</html>

View File

@@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
html
{
background-color: green;
color: white;
height: 100%;
}
body {margin: 0;}
</style>
</head>
<body>
<div>Test passes if there is <strong>no red</strong>.</div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<title>CSS Test: Test for containing block for absolutely positioned elements being initial containing block</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
<style type="text/css">
body { margin:0; }
.pos { position:absolute; width:100px; height:100px; }
</style>
</head>
<body>
<div style="height:10000px; margin:0; margin:10px; border:20px solid black; padding:30px;"></div>
<script type="text/javascript">
window.scrollTo(0,50);
</script>
<div style="top:0; left:60px; background:yellow;" class="pos"></div>
<div style="right:0; top:60px; background:orange;" class="pos"></div>
<div style="bottom:0; left:60px; background:brown;" class="pos"></div>
<div style="left:0; top:60px; background:pink;" class="pos"></div>
</body></html>

View File

@@ -0,0 +1,9 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html style="background:yellow;"><head><title>CSS Test: Test for containing block for absolutely positioned elements being initial containing block</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
</head><body>
<div style="position:absolute; top:100px; left:100px; width:100px; height:100px; border:10px solid black;"></div>
</body></html>

View File

@@ -0,0 +1,9 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html style="background:yellow;"><head><title>CSS Test: Test for containing block for absolutely positioned elements being initial containing block</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
</head><body style="margin:0">
<div style="border:10px solid black; width:100px; height:100px;"></div>
</body></html>

View File

@@ -0,0 +1,11 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><title>CSS Test: Test for containing block for absolutely positioned elements being initial containing block</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
</head><body style="margin:0;">
<div style="position:relative; top:100px; left:100px; height:100px; border:10px solid black;">
<div style="position:absolute; bottom:0; height:30px; border:10px solid orange;">
</div>
</div></body></html>

View File

@@ -0,0 +1,9 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><title>CSS Test: Test for containing block for absolutely positioned elements being initial containing block</title>
<link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org">
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
</head><body style="margin:0">
<div style="position:fixed; width:50%; height:50%; left:50px; top:50px; border:10px solid black;"></div>
</body></html>

View File

@@ -0,0 +1,458 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Test Reference</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="alternate" href="http://mxr.mozilla.org/mozilla-central/source/layout/reftests/abspos-non-replaced-width-offset-margin-ref.html">
<style type="text/css">
html, body { margin: 0; padding: 0; border: none; }
div { height: 1px; background: navy; }
</style>
</head>
<body>
<!-- ***** NARROW WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<!-- only left auto -->
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<div style="margin-left: 496px; width: 177px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<div style="margin-left: 454px; width: 177px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<div style="margin-left: 70px; width: 177px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 167px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<!-- margin-left and margin-right auto -->
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<div style="margin-left: 284px; width: 177px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<div style="margin-left: 515px; width: 177px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<div style="margin-left: 53px; width: 177px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 150px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<div style="margin-left: 473px; width: 177px;"></div>
<!-- AUTO WIDTH -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<div style="margin-left: 70px; width: 603px;"></div>
<!-- only left auto -->
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<!-- only margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<div style="margin-left: 53px; width: 620px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<div style="margin-left: 577px; width: 96px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<div style="margin-left: 535px; width: 96px;"></div>
<!-- only margin-right auto (margin-right like 0) -->
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<div style="margin-left: 70px; width: 622px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<div style="margin-left: 70px; width: 96px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 167px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<!-- margin-left and margin-right auto (both like 0) -->
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<div style="margin-left: 53px; width: 639px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<div style="margin-left: 596px; width: 96px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<div style="margin-left: 53px; width: 96px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 150px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<div style="margin-left: 554px; width: 96px;"></div>
<!-- ***** WIDE WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<!-- only left auto -->
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<div style="margin-left: -11px; width: 684px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<div style="margin-left: -53px; width: 684px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<div style="margin-left: 70px; width: 684px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: 167px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<!-- margin-left and margin-right auto (alternately like 0) -->
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<div style="margin-left: 8px; width: 684px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<div style="margin-left: 53px; width: 684px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: 150px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
<div style="margin-left: -34px; width: 684px;"></div>
</body>
</html>

View File

@@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body
{
line-height: 1.25;
margin-left: 0;
}
div#positioned
{
background: green;
color: white;
left: 0;
position: absolute;
top: 0;
width: 10em;
}
p {margin-top: 36px;}
div#overflow
{
height: 8em;
overflow: scroll;
width: 8em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
<p>Ignore the scrollbars below.</p>
<div id="overflow"></div>
</body>
</html>

View File

@@ -0,0 +1,48 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body
{
line-height: 1.25;
margin-left: 0;
}
div#positioned
{
background: green;
color: white;
right: 0;
position: absolute;
top: 0;
width: 10em;
}
p {margin-top: 36px;}
div#overflow
{
height: 8em;
overflow: scroll;
width: 8em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
<p>Ignore the scrollbars below.</p>
<div id="overflow"></div>
</body>
</html>

View File

@@ -0,0 +1,45 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin-left: 0;}
div#positioned
{
background: green;
color: white;
height: 5em;
left: 5em;
position: absolute;
top: 5em;
width: 5em;
}
p {margin-top: 11em;}
div#overflow
{
height: 8em;
overflow: scroll;
width: 8em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
<p>Ignore the scrollbars below.</p>
<div id="overflow"></div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin-left: 0;}
div#positioned
{
background: green;
color: white;
left: 0;
position: absolute;
top: 0;
width: 10em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin-left: 0;}
div#positioned
{
background: green;
color: white;
position: absolute;
right: 0;
top: 0;
width: 10em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
</body>
</html>

View File

@@ -0,0 +1,32 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin-left: 0;}
div#positioned
{
background: green;
color: white;
height: 5em;
left: 5em;
position: absolute;
top: 5em;
width: 5em;
}
</style>
</head>
<body>
<div id="positioned">PASS</div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {color: green;}
</style>
</head>
<body>
<p>There should be green text below.</p>
<div>This text should be green.</div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {color: green;}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div>This text should be green.</div>
</body>
</html>

View File

@@ -0,0 +1,606 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Test Reference</title>
<link rel="author" title="L. David Baron" href="http://dbaron.org/">
<link rel="alternate" href="http://mxr.mozilla.org/mozilla-central/source/layout/reftests/abspos-replaced-width-offset-margin-ref.html">
<style type="text/css">
html, body { margin: 0; padding: 0; border: none; }
div { height: 1px; background: blue;
border-left: 7px solid navy; border-right: 17px solid navy; }
</style>
</head>
<body>
<!-- ***** WIDE WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- only left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<!-- margin-left and margin-right auto (alternately like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<!-- ***** NARROW WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- only left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<!-- margin-left and margin-right auto -->
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<!-- ***** NARROW WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- only left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<div style="margin-left: 496px; width: 153px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<div style="margin-left: 454px; width: 153px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<div style="margin-left: 70px; width: 153px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 167px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<!-- margin-left and margin-right auto -->
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<div style="margin-left: 284px; width: 153px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<div style="margin-left: 515px; width: 153px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<div style="margin-left: 53px; width: 153px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 150px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<div style="margin-left: 473px; width: 153px;"></div>
<!-- ***** WIDE WIDTH ***** -->
<!-- nothing auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- only left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- only right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and right auto -->
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<!-- only margin-left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- left and margin-left auto -->
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<div style="margin-left: -11px; width: 660px;"></div>
<!-- right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<!-- left and right and margin-left auto (margin-left like 0) -->
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<div style="margin-left: -53px; width: 660px;"></div>
<!-- only margin-right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- right and margin-right auto -->
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<div style="margin-left: 70px; width: 660px;"></div>
<!-- left and right and margin-right auto (margin-right like 0) -->
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: 167px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<!-- margin-left and margin-right auto (alternately like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- left and margin-left and margin-right auto (margin-right like 0) -->
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<div style="margin-left: 8px; width: 660px;"></div>
<!-- right and margin-left and margin-right auto (margin-left like 0) -->
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<div style="margin-left: 53px; width: 660px;"></div>
<!-- left and right and margin-left and margin-right auto (margin-left and margin-right like 0) -->
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: 150px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
<div style="margin-left: -34px; width: 660px;"></div>
</body>
</html>

View File

@@ -0,0 +1,38 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div#parent
{
border: fuchsia solid thin;
height: 5em;
padding: 1em;
width: 10em;
}
div#child
{
border: aqua solid thin;
padding: 1em;
width: 3em;
}
</style>
</head>
<body>
<p>The blue rectangle should be well within the pink rectangle, but its text should overflow out of both rectangles.</p>
<div id="parent">
<div id="child">overflowyflowyflowyflowyflowyflowyflowyflowy</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if the orange square is to the left of the blue square and the squares top edges are aligned.</p>
<div><img src="support/swatch-orange.png" width="96" height="96" alt="Image download support must be enabled"><img src="support/swatch-blue.png" width="96" height="96" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if the 2 "Filler text" are both <strong>on the same line</strong>.</p>
<div>Filler text Filler text</div>
</body>
</html>

View File

@@ -0,0 +1,21 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if there are <strong>2 lines of "Filler text"</strong>.</p>
<div>Filler text</div>
<div>Filler text</div>
</body>
</html>

View File

@@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
ul
{
margin: 0;
padding: 0;
}
li {margin-left: 1em;}
</style>
</head>
<body>
<p>Test passes if there are <strong>2 lines of "Filler text"</strong>. The 2nd line should be preceded with a bullet list-marker (a "disc" as a small filled-in circle).</p>
<div>Filler text</div>
<ul>
<li>Filler text</li>
</ul>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if there is <strong>one "Filler text"</strong> and no red.</p>
<div>Filler text</div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
text-align: center;
width: 2in;
}
div + div
{
background-color: blue;
height: 1em;
}
</style>
</head>
<body>
<p>Test passes if "Filler Text" is centered above the blue stripe.</p>
<div>Filler Text</div>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body {margin: 8px;}
div
{
background-color: green;
height: 100px;
margin-left: 200px;
width: 100px;
}
</style>
</head>
<body>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
body
{
font: 1em/1.25 serif;
margin: 8px;
}
p {margin: 1em 0;}
strong {line-height: 1;}
div
{
background-color: green;
height: 100px;
margin-top: 66px;
}
</style>
</head>
<body>
<p>Test passes if there is a filled green<br>
rectangle across the page and <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,33 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
height: 100px;
width: 100px;
}
div#blue {background-color: blue;}
div#orange {background-color: orange}
</style>
</head>
<body>
<p>Test passes if the 2 squares have the <strong>same size</strong>.</p>
<div id="blue"></div>
<div id="orange"></div>
</body>
</html>

View File

@@ -0,0 +1,7 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head></head><body style="color: green">
This should be green
</body></html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if there is a filled green rectangle across the page.</p>
<div><img src="support/1x1-green.png" width="100%" height="50" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,23 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {height: 5in;}
</style>
</head>
<body>
<p>Test passes if there is a green stripe across the page.</p>
<div><img src="support/1x1-green.png" width="100%" height="15" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: blue;
height: 15px;
}
div + div
{
background-color: green;
height: 185px;
}
</style>
</head>
<body>
<p>Test passes if there is a blue stripe above a green rectangle across the page.</p>
<div></div>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,19 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong>.</p>
<div><img src="support/1x1-green.png" width="200" height="200" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
table
{
border-spacing: 0px;
height: 206px;
}
td
{
border: black solid 3px;
padding: 0px;
vertical-align: bottom;
width: 200px;
}
img {vertical-align: bottom;}
</style>
</head>
<body>
<p>Test passes if there is a blue stripe inside the hollow black square, positioned at the bottom of the black square.</p>
<table>
<tr><td><img src="support/blue15x15.png" width="100%" height="15" alt="Image download support must be enabled"></td></tr>
</table>
</body>
</html>

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div {width: 100px;}
img {vertical-align: top;}
</style>
</head>
<body>
<p>Test passes if there is an orange rectangle above a blue stripe.</p>
<div><img src="support/swatch-orange.png" width="100%" height="85" alt="Image download support must be enabled"></div>
<div><img src="support/swatch-blue.png" width="100%" height="15" alt="Image download support must be enabled"></div>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
table
{
border-spacing: 0px;
height: 200px;
}
td
{
background-color: green;
padding: 0px;
vertical-align: bottom;
width: 200px;
}
img {vertical-align: bottom;}
</style>
</head>
<body>
<p>Test passes if there is a green rectangle on top of a blue stripe.</p>
<table>
<tr><td><img src="support/blue15x15.png" width="100%" height="15" alt="Image download support must be enabled"></td></tr>
</table>
</body>
</html>

View File

@@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
table
{
border-spacing: 0px;
height: 100px;
}
td
{
background-color: green;
padding: 0px;
vertical-align: bottom;
width: 100px;
}
img {vertical-align: bottom;}
</style>
</head>
<body>
<p>Test passes if there is a filled green rectangle above a short blue stripe.</p>
<table>
<tr><td><img src="support/blue15x15.png" width="100%" height="15" alt="Image download support must be enabled"></td></tr>
</table>
</body>
</html>

View File

@@ -0,0 +1,27 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div
{
background-color: green;
height: 1in;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div></div>
</body>
</html>

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CSS Reftest Reference</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style type="text/css">
div#first {line-height: 15px;}
img
{
vertical-align: top;
width: 100%;
}
</style>
</head>
<body>
<p>Test passes if there is <strong>no red</strong>.</p>
<div id="first"><img src="support/swatch-green.png" height="15" alt="Image download support must be enabled"></div>
<div><img src="support/black15x15.png" height="81" alt="Image download support must be enabled"></div>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show More