mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests and CSS tests.
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
This commit is contained in:
Ms2ger
parent
fb4f421c8b
commit
296fa2512b
21852 changed files with 2080936 additions and 892894 deletions
|
|
@ -1,7 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head><title>background-image referance</title>
|
||||
<link href="
|
||||
http://www.justin-hill.com" rel="author" title="Justin Hill">
|
||||
<link href="http://www.justin-hill.com" rel="author" title="Justin Hill">
|
||||
<style>
|
||||
.green {
|
||||
top:50px;
|
||||
|
|
@ -10,5 +9,6 @@
|
|||
</style>
|
||||
</head><body>
|
||||
<p> Test passes if green image shows and no red visable.</p>
|
||||
<img src="../green.png" class="green">
|
||||
<img src="../support/green.png" class="green">
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: background image repeat</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat;
|
||||
}
|
||||
.outer_gradient {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-size: 36px 36px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-repeat: repeat;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
<div class="outer_gradient"></div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: background image repeat</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
.outer_gradient {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
<div class="outer_gradient"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: background image repeat</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
#outer {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat-y;
|
||||
}
|
||||
#outer_gradient {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat-y;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
<div id="outer_gradient"><div id="inner"></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: background image repeat with specified position</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat;
|
||||
background-position: 5px 5px;
|
||||
}
|
||||
.outer_gradient {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: 1px solid black;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-size: 36px 36px;
|
||||
background-repeat: repeat;
|
||||
background-position: 5px 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
<div class="outer_gradient"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
}
|
||||
.outer_gradient
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner_gradient
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<div class="outer_gradient">
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 96px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 1px solid black;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 5px 5px;
|
||||
}
|
||||
.outer_gradient {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 1px solid black;
|
||||
background-size: 32px 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 5px 5px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
<div class="outer_gradient"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer1
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.inner1
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
margin-top: 40px;
|
||||
}
|
||||
.outer2
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner2
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
margin-left: 40px;
|
||||
}
|
||||
.inner_gradient1
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-size: 32px 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
margin-top: 40px;
|
||||
}
|
||||
.inner_gradient2
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-size: 32px 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
margin-left: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer1">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner1"></div>
|
||||
<div class="inner1"></div>
|
||||
</div>
|
||||
<div class="outer2">
|
||||
<div class="inner2"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner2"></div>
|
||||
</div>
|
||||
<div class="outer1">
|
||||
<div class="inner_gradient1"></div>
|
||||
<div class="inner_gradient1"></div>
|
||||
<div class="inner_gradient1"></div>
|
||||
</div>
|
||||
<div class="outer2">
|
||||
<div class="inner_gradient2"></div>
|
||||
<div class="inner_gradient2"></div>
|
||||
<div class="inner_gradient2"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 96px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
}
|
||||
.inner_gradient
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-size: 32px 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<div class="outer">
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 96px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
}
|
||||
.inner_gradient
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-size: 32px 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<div class="outer">
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 192px;
|
||||
height: 106px;
|
||||
display: flex;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 64px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 64px 32px;
|
||||
}
|
||||
.inner_gradient
|
||||
{
|
||||
height: 32px;
|
||||
width: 64px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 64px 32px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<div class="outer">
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 192px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 64px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 32px 64px;
|
||||
}
|
||||
.inner_gradient
|
||||
{
|
||||
height: 64px;
|
||||
width: 32px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 32px 64px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<div class="outer">
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
<div class="inner_gradient"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 20px solid rgba(0, 0, 0, 0.5);
|
||||
width: 106px;
|
||||
height: 106px;
|
||||
background-image: url(aqua-yellow-37x37.png);
|
||||
background-repeat: repeat;
|
||||
}
|
||||
.outer_gradient
|
||||
{
|
||||
border: 20px solid rgba(0, 0, 0, 0.5);
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
background-size: 50px 50px;
|
||||
background-image: linear-gradient(to top left, red, green);
|
||||
background-repeat: no-repeat;
|
||||
background-position: -10px -10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
<div class="outer_gradient"></div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Background: background-repeat: position background image</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
width: 106px;
|
||||
height: 96px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.inner
|
||||
{
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
background-image: url(aqua-yellow-32x32.png);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<title>CSS Background and Border Test:background-size conflicts with background-attachment</title>
|
||||
<link href="stenders@163.com" rel="author" title="xiaochun">
|
||||
<link href="jinlongz@oupeng.com" rel="reviewer" title="Jinlong Zhang"><!--2012/10/21-->
|
||||
<link href="mailto:stenders@163.com" rel="author" title="xiaochun">
|
||||
<link href="mailto:jinlongz@oupeng.com" rel="reviewer" title="Jinlong Zhang"><!--2012/10/21-->
|
||||
<meta content="The test passes if we can see the background-image is exactly same as above." name="assert">
|
||||
<style type="text/css">
|
||||
.backgroundSize{
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<title>CSS Backgrounds and Borders Test: background-clip_border-box</title>
|
||||
<link href="dajiangxiaoyan@126.com" rel="author" title="Xiaoyan Jiang">
|
||||
<link href="jinlongz@oupeng.com" rel="reviewer" title="Jinlong Zhang">
|
||||
<link href="mailto:dajiangxiaoyan@126.com" rel="author" title="Xiaoyan Jiang">
|
||||
<link href="mailto:jinlongz@oupeng.com" rel="reviewer" title="Jinlong Zhang">
|
||||
<style type="text/css">
|
||||
/* Positioned container allows for the self-describing statement to still
|
||||
be visible in the case of failure */
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat with SVG content</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
</head>
|
||||
<body>
|
||||
<svg width="64" version="1.1" xmlns:xmlns="http://www.w3.org/2000/svg" height="48">
|
||||
<g stroke-width="0" fill="blue">
|
||||
<path d="M2 2h4v44H2z"></path>
|
||||
<path d="M2 2h60v4H2z"></path>
|
||||
<path d="M58 2h4v44h-4z"></path>
|
||||
<path d="M2 42h60v4H2zM8"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: round</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 27px;
|
||||
width: 34px;
|
||||
height: 27px;
|
||||
background-size: 102px 81px;
|
||||
background-image: url("border.png");
|
||||
background-position: -34px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 61px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 34px;
|
||||
background-size: 81px 102px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -34px;
|
||||
}
|
||||
.inner5 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 61px;
|
||||
width: 27px;
|
||||
height: 34px;
|
||||
background-size: 81px 102px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -34px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 61px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 61px;
|
||||
left: 27px;
|
||||
width: 34px;
|
||||
height: 27px;
|
||||
background-size: 102px 81px;
|
||||
background-image: url("border.png");
|
||||
background-position: -34px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 61px;
|
||||
left: 61px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
<div class="inner5"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: round</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 27px;
|
||||
width: 13px;
|
||||
height: 27px;
|
||||
background-size: 39px 81px;
|
||||
background-image: url("border.png");
|
||||
background-position: -13px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 40px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 13px;
|
||||
background-size: 81px 39px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -13px;
|
||||
}
|
||||
.inner5 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 40px;
|
||||
width: 27px;
|
||||
height: 13px;
|
||||
background-size: 81px 39px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -13px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 27px;
|
||||
width: 13px;
|
||||
height: 27px;
|
||||
background-size: 39px 81px;
|
||||
background-image: url("border.png");
|
||||
background-position: -13px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 40px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
<div class="inner5"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 31px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 62px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 31px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner5 {
|
||||
position: absolute;
|
||||
top: 31px;
|
||||
left: 62px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 62px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 62px;
|
||||
left: 31px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 62px;
|
||||
left: 62px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
<div class="inner5"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: round</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 67px;
|
||||
height: 67px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 40px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 40px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,136 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 114px;
|
||||
height: 114px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2_1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 29px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner2_2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 58px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 87px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4_1 {
|
||||
position: absolute;
|
||||
top: 29px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner4_2 {
|
||||
position: absolute;
|
||||
top: 58px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner5_1 {
|
||||
position: absolute;
|
||||
top: 29px;
|
||||
left: 87px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner5_2 {
|
||||
position: absolute;
|
||||
top: 58px;
|
||||
left: 87px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 87px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7_1 {
|
||||
position: absolute;
|
||||
top: 87px;
|
||||
left: 29px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner7_2 {
|
||||
position: absolute;
|
||||
top: 87px;
|
||||
left: 58px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 87px;
|
||||
left: 87px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2_1"></div>
|
||||
<div class="inner2_2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4_1"></div>
|
||||
<div class="inner4_2"></div>
|
||||
<div class="inner5_1"></div>
|
||||
<div class="inner5_2"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7_1"></div>
|
||||
<div class="inner7_2"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<link href="reference/border-image-repeat-space-4-ref-2.htm" rel="match">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner5 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
<div class="inner5"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
border: 27px solid transparent;
|
||||
border-image: url("border.png") 27;
|
||||
border-image-repeat: stretch stretch;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,177 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<link href="reference/border-image-repeat-space-5-ref-2.htm" rel="match">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 135px;
|
||||
height: 135px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner2_1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner2_2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner2_3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 81px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px 0px;
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 108px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner4_1 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner4_2 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner4_3 {
|
||||
position: absolute;
|
||||
top: 81px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: 0px -27px;
|
||||
}
|
||||
.inner5_1 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 108px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner5_2 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 108px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner5_3 {
|
||||
position: absolute;
|
||||
top: 81px;
|
||||
left: 108px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -54px -27px;
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 108px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
.inner7_1 {
|
||||
position: absolute;
|
||||
top: 108px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner7_2 {
|
||||
position: absolute;
|
||||
top: 108px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner7_3 {
|
||||
position: absolute;
|
||||
top: 108px;
|
||||
left: 81px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
background-position: -27px -54px;
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 108px;
|
||||
left: 108px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("border.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2_1"></div>
|
||||
<div class="inner2_2"></div>
|
||||
<div class="inner2_3"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4_1"></div>
|
||||
<div class="inner4_2"></div>
|
||||
<div class="inner4_3"></div>
|
||||
<div class="inner5_1"></div>
|
||||
<div class="inner5_2"></div>
|
||||
<div class="inner5_3"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7_1"></div>
|
||||
<div class="inner7_2"></div>
|
||||
<div class="inner7_3"></div>
|
||||
<div class="inner8"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
border: 27px solid transparent;
|
||||
border-image: url("border.png") 27;
|
||||
border-image-repeat: repeat repeat;
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,101 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 81px;
|
||||
height: 81px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-tl.png");
|
||||
}
|
||||
.inner2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-to.png");
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-tr.png");
|
||||
}
|
||||
.inner4 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-le.png");
|
||||
}
|
||||
.inner5 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ct.png");
|
||||
}
|
||||
.inner6 {
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ri.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-bl.png");
|
||||
}
|
||||
.inner8 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 27px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-bo.png");
|
||||
}
|
||||
.inner9 {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
left: 54px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-br.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4"></div>
|
||||
<div class="inner5"></div>
|
||||
<div class="inner6"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8"></div>
|
||||
<div class="inner9"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,164 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Border Image: border-image-repeat: space</title>
|
||||
<link href="mailto:ethlin@mozilla.com" rel="author" title="Ethan Lin">
|
||||
<link href="https://www.mozilla.org" rel="author" title="Mozilla">
|
||||
<style type="text/css">
|
||||
.outer {
|
||||
width: 132px;
|
||||
height: 132px;
|
||||
}
|
||||
.inner1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-tl.png");
|
||||
}
|
||||
.inner2_1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 35px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-to.png");
|
||||
}
|
||||
.inner2_2 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 70px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-to.png");
|
||||
}
|
||||
.inner3 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 105px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-tr.png");
|
||||
}
|
||||
.inner4_1 {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-le.png");
|
||||
}
|
||||
.inner4_2 {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-le.png");
|
||||
}
|
||||
.inner5_1 {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 35px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ct.png");
|
||||
}
|
||||
.inner5_2 {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 70px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ct.png");
|
||||
}
|
||||
.inner5_3 {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 35px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ct.png");
|
||||
}
|
||||
.inner5_4 {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 70px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ct.png");
|
||||
}
|
||||
.inner6_1 {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 105px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ri.png");
|
||||
}
|
||||
.inner6_2 {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 105px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-ri.png");
|
||||
}
|
||||
.inner7 {
|
||||
position: absolute;
|
||||
top: 105px;
|
||||
left: 0px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-bl.png");
|
||||
}
|
||||
.inner8_1 {
|
||||
position: absolute;
|
||||
top: 105px;
|
||||
left: 35px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-bo.png");
|
||||
}
|
||||
.inner8_2 {
|
||||
position: absolute;
|
||||
top: 105px;
|
||||
left: 70px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-bo.png");
|
||||
}
|
||||
.inner9 {
|
||||
position: absolute;
|
||||
top: 105px;
|
||||
left: 105px;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
background-image: url("reticule-br.png");
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="outer">
|
||||
<div class="inner1"></div>
|
||||
<div class="inner2_1"></div>
|
||||
<div class="inner2_2"></div>
|
||||
<div class="inner3"></div>
|
||||
<div class="inner4_1"></div>
|
||||
<div class="inner4_2"></div>
|
||||
<div class="inner5_1"></div>
|
||||
<div class="inner5_2"></div>
|
||||
<div class="inner5_3"></div>
|
||||
<div class="inner5_4"></div>
|
||||
<div class="inner6_1"></div>
|
||||
<div class="inner6_2"></div>
|
||||
<div class="inner7"></div>
|
||||
<div class="inner8_1"></div>
|
||||
<div class="inner8_2"></div>
|
||||
<div class="inner9"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference</title>
|
||||
<link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
|
||||
<style type="text/css">
|
||||
|
||||
.container {
|
||||
margin: 4px;
|
||||
border: solid green 4px;
|
||||
padding-top: 1px;
|
||||
border-style: none none solid solid;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>There must be 31 green L-shapes below and no red.</p>
|
||||
|
||||
<div id="c1" class="container"><div></div></div>
|
||||
<div id="c2" class="container"><div></div></div>
|
||||
<div id="c3" class="container"><div></div></div>
|
||||
<div id="c4" class="container"><div></div></div>
|
||||
<div id="c5" class="container"><div></div></div>
|
||||
<div id="c6" class="container"><div></div></div>
|
||||
<div id="i1" class="container"><div></div></div>
|
||||
<div id="i2" class="container"><div></div></div>
|
||||
<div id="i3" class="container"><div></div></div>
|
||||
<div id="i4" class="container"><div></div></div>
|
||||
<div id="i5" class="container"><div></div></div>
|
||||
<div id="i6" class="container"><div></div></div>
|
||||
<div id="i7" class="container"><div></div></div>
|
||||
<div id="ci1" class="container"><div></div></div>
|
||||
<div id="ci2" class="container"><div></div></div>
|
||||
<div id="ci3" class="container"><div></div></div>
|
||||
<div id="ci4" class="container"><div></div></div>
|
||||
<div id="ci5" class="container"><div></div></div>
|
||||
<div id="ci6" class="container"><div></div></div>
|
||||
<div id="ci11" class="container"><div></div></div>
|
||||
<div id="ci12" class="container"><div></div></div>
|
||||
<div id="ci13" class="container"><div></div></div>
|
||||
<div id="ci14" class="container"><div></div></div>
|
||||
<div id="ci15" class="container"><div></div></div>
|
||||
<div id="ci16" class="container"><div></div></div>
|
||||
<div id="ci21" class="container"><div></div></div>
|
||||
<div id="ci22" class="container"><div></div></div>
|
||||
<div id="ci23" class="container"><div></div></div>
|
||||
<div id="ci24" class="container"><div></div></div>
|
||||
<div id="ci25" class="container"><div></div></div>
|
||||
<div id="ci26" class="container"><div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-tall-empty.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-tall-lime.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
background: lime;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-tall-lime192x384-aqua192x384.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 192px; height: 768px;
|
||||
}
|
||||
#inner > div { width: 192px; height: 384px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
<title>tall reference, 256x16 lime, 256x16 aqua</title>
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 256px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 256px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
<title>tall reference, 256x384 lime, 256x384 aqua</title>
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#inner > div { width: 256px; height: 384px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-tall-lime256x512-aqua256x256.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#inner > div { width: 256px; }
|
||||
#top { background-color: lime; height: 512px; }
|
||||
#bottom { background-color: aqua; height: 256px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-tall-lime256x768.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
#outer
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
background-color: lime;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
<title>tall reference, 2x16 lime, 2x16 aqua</title>
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 2px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 2px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
<title>tall reference, 48x384 lime, 48x384 aqua</title>
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 48px; height: 768px;
|
||||
}
|
||||
#inner > div { width: 48px; height: 384px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
<title>tall reference, 8x16 lime, 8x16 aqua</title>
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 256px; height: 768px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 8px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 8px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-empty.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
background: lime;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime12x128-aqua12x128.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 12px; height: 256px;
|
||||
}
|
||||
#inner > div { width: 12px; height: 128px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime12x16-aqua12x16.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 12px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 12px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime12x24-aqua12x24.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 12px; height: 48px;
|
||||
}
|
||||
#inner > div { width: 12px; height: 24px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime12x96-aqua12x96.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 12px; height: 192px;
|
||||
}
|
||||
#inner > div { width: 12px; height: 96px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime16x128-aqua16x128.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 16px; height: 256px;
|
||||
}
|
||||
#inner > div { width: 16px; height: 128px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime2x16-aqua2x16.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 2px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 2px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime64x128-aqua64x128.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 64px; height: 256px;
|
||||
}
|
||||
#inner > div { width: 64px; height: 128px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime768x128-aqua768x128.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#inner > div { width: 768px; height: 128px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime768x16-aqua768x16.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 768px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 768px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime768x256.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
background-color: lime;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime8x128-aqua8x128.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 8px; height: 256px;
|
||||
}
|
||||
#inner > div { width: 8px; height: 128px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime8x16-aqua8x16.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 8px; height: 32px;
|
||||
}
|
||||
#inner > div { width: 8px; height: 16px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
--><html><head>
|
||||
|
||||
<!--
|
||||
The original and initial filename of this reference file was
|
||||
ref-wide-lime8x64-aqua8x64.html
|
||||
-->
|
||||
|
||||
<title>CSS Reftest Reference</title>
|
||||
|
||||
<link href="http://whereswalden.com/" rel="author" title="Jeff Walden">
|
||||
|
||||
<style type="text/css">
|
||||
div
|
||||
{
|
||||
width: 768px; height: 256px;
|
||||
}
|
||||
#outer
|
||||
{
|
||||
border: 1px solid black;
|
||||
}
|
||||
#inner
|
||||
{
|
||||
width: 8px; height: 128px;
|
||||
}
|
||||
#inner > div { width: 8px; height: 64px; }
|
||||
#top { background-color: lime; }
|
||||
#bottom { background-color: aqua; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<Files ~ "^at-charset-00[1-6].css$">
|
||||
AddCharset Shift_JIS .css
|
||||
</Files>
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue