mirror of
https://github.com/servo/servo.git
synced 2025-10-01 00:59:15 +01:00
Auto merge of #8088 - frewsxcv:reftests, r=jdm
Use wptrunner for some old-style reftests. Part of #5618 <!-- Reviewable:start --> [<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/8088) <!-- Reviewable:end -->
This commit is contained in:
commit
ecee44da0e
112 changed files with 1376 additions and 55 deletions
File diff suppressed because it is too large
Load diff
19
tests/wpt/mozilla/tests/css/img_size_a.html
Normal file
19
tests/wpt/mozilla/tests/css/img_size_a.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='img_size_b.html'>
|
||||
<title>
|
||||
The winter is too cold for me...
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<img src="rust_logo.png" width="206" />
|
||||
</div>
|
||||
<div>
|
||||
<img src="rust_logo.png" width="206" />
|
||||
</div>
|
||||
<div style="width:1000px">
|
||||
<img src="rust_logo.png" style="width:100px" />
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
18
tests/wpt/mozilla/tests/css/img_size_b.html
Normal file
18
tests/wpt/mozilla/tests/css/img_size_b.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>
|
||||
The winter is too cold for me...
|
||||
</title>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<img src="rust_logo.png" height="206" />
|
||||
</div>
|
||||
<div>
|
||||
<img src="rust_logo.png" style="height:206px"/>
|
||||
</div>
|
||||
<div style="width:1000px">
|
||||
<img src="rust_logo.png" style="width:10%" />
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='img_width_style_intrinsic_width_ref.html'>
|
||||
</head>
|
||||
<body>
|
||||
<div style="float: left; background: red; height: 100px; overflow: hidden">
|
||||
<img src=400x400_green.png style="width: 100px;">
|
||||
</div>
|
||||
There should be no red.
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
</head>
|
||||
<body>
|
||||
<div style="float: left; height: 100px; overflow: hidden">
|
||||
<img src=400x400_green.png style="width: 100px;">
|
||||
</div>
|
||||
There should be no red.
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
37
tests/wpt/mozilla/tests/css/incremental_float_a.html
Normal file
37
tests/wpt/mozilla/tests/css/incremental_float_a.html
Normal file
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='incremental_float_ref.html'>
|
||||
<style>
|
||||
nav.floaty {
|
||||
float: left;
|
||||
}
|
||||
section {
|
||||
clear: both;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div>This doesn't</div>
|
||||
</section>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div style="overflow: hidden;">This is a block formatting context</div>
|
||||
</section>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div style="position: absolute; top: 0; left: 0; width: 100px; height: 100px;">
|
||||
This is abspos
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
var elements = document.getElementsByTagName('nav');
|
||||
for (var i = 0; i < elements.length; i++)
|
||||
elements[i].setAttribute('class', 'floaty');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
31
tests/wpt/mozilla/tests/css/incremental_float_ref.html
Normal file
31
tests/wpt/mozilla/tests/css/incremental_float_ref.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
nav {
|
||||
float: left;
|
||||
}
|
||||
section {
|
||||
clear: both;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div>This doesn't</div>
|
||||
</section>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div style="overflow: hidden;">This is a block formatting context</div>
|
||||
</section>
|
||||
<section>
|
||||
<nav>This floats</nav>
|
||||
<div style="position: absolute; top: 0; left: 0; width: 100px; height: 100px;">
|
||||
This is abspos
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
33
tests/wpt/mozilla/tests/css/incremental_inline_layout_a.html
Normal file
33
tests/wpt/mozilla/tests/css/incremental_inline_layout_a.html
Normal file
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='incremental_inline_layout_ref.html'>
|
||||
<style>
|
||||
h1 {
|
||||
font-size: 72px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1 id=h1>
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
</h1>
|
||||
<script>
|
||||
document.getElementById('h1').getBoundingClientRect(); // Trigger one layout.
|
||||
document.getElementById('h1').getBoundingClientRect(); // Trigger another layout.
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
h1 {
|
||||
font-size: 72px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1 id=h1>
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
Incremental Inline Layout
|
||||
</h1>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='incremental_letter_spacing_ref.html'>
|
||||
<meta charset="UTF-8">
|
||||
<title>Incremental layout letter-spacing test</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Hello, world!</p>
|
||||
<script>
|
||||
window.addEventListener("load", function() {
|
||||
document.querySelector("p").style.letterSpacing = "1em";
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Incremental layout letter-spacing reference</title>
|
||||
</head>
|
||||
<body>
|
||||
<p style="letter-spacing: 1em">Hello, world!</p>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='inline_absolute_hypothetical_clip_ref.html'>
|
||||
<style>
|
||||
body {
|
||||
margin: 16px;
|
||||
}
|
||||
#a {
|
||||
position: relative;
|
||||
}
|
||||
#b {
|
||||
clip: rect(47px, 118px, 95px, 0);
|
||||
position: absolute;
|
||||
}
|
||||
</style>
|
||||
<a href="http://bogus" id=a><img id=b width=250 src=400x400_green.png>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
background: lime;
|
||||
top: 63px;
|
||||
width: 118px;
|
||||
height: 48px;
|
||||
left: 16px;
|
||||
}
|
||||
</style>
|
||||
<section></section>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='inline_absolute_out_of_flow_ref.html'>
|
||||
<style>
|
||||
#a {
|
||||
display: inline;
|
||||
position: relative;
|
||||
}
|
||||
#b {
|
||||
position: absolute;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
<div>A<span id=a><div id=b> </div></span>B</div>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<!DOCTYPE html>
|
||||
<div>AB</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_block_direction_margins_ref.html'>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
margin-top: 100px;
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
div {
|
||||
background: steelblue;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>Four <span>score</span> and seven years ago</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
div {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 100px;
|
||||
background: steelblue;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div>Four <span>score</span> and seven years ago</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
8
tests/wpt/mozilla/tests/css/inline_block_border_a.html
Normal file
8
tests/wpt/mozilla/tests/css/inline_block_border_a.html
Normal file
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel='match' href='inline_block_border_ref.html'>
|
||||
<body>
|
||||
<div style="display: inline-block; border: solid black 1px; padding: 6px; height: 64px; width: 64px;"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
8
tests/wpt/mozilla/tests/css/inline_block_border_ref.html
Normal file
8
tests/wpt/mozilla/tests/css/inline_block_border_ref.html
Normal file
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<div style="display: block; border: solid black 1px; padding: 6px; height: 64px; width: 64px;"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
37
tests/wpt/mozilla/tests/css/inline_block_img_a.html
Normal file
37
tests/wpt/mozilla/tests/css/inline_block_img_a.html
Normal file
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_img_ref.html'>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: white;
|
||||
}
|
||||
.red {
|
||||
color: red;
|
||||
}
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
.ib {
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
font-family: ahem;
|
||||
font-size: 100px;
|
||||
}
|
||||
.bg {
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="bg">
|
||||
<span class="red">X</span><img src="400x400_green.png"><span class="green ib">X</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
47
tests/wpt/mozilla/tests/css/inline_block_img_ref.html
Normal file
47
tests/wpt/mozilla/tests/css/inline_block_img_ref.html
Normal file
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.red {
|
||||
background-color: red;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
.d1 {
|
||||
position: absolute;
|
||||
top: 320px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.d2 {
|
||||
position: absolute;
|
||||
left: 500px;
|
||||
top: 320px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
img {
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
}
|
||||
.bg {
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="bg">
|
||||
<div class="d1 red"></div>
|
||||
<img src="400x400_green.png">
|
||||
<div class="d2 green"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
25
tests/wpt/mozilla/tests/css/inline_block_margin_a.html
Normal file
25
tests/wpt/mozilla/tests/css/inline_block_margin_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_margin_ref.html'>
|
||||
<style type="text/css">
|
||||
body {
|
||||
font-family: 'ahem';
|
||||
font-size: 100px;
|
||||
margin: 32px;
|
||||
}
|
||||
.ib {
|
||||
display: inline-block;
|
||||
}
|
||||
.yellow {
|
||||
color: #ff0;
|
||||
}
|
||||
.grey {
|
||||
color: #eee;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="grey">X<span class="yellow ib">X</span></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='inline_block_margin_auto_zero_ref.html'>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
width: 300px;
|
||||
height: 100px;
|
||||
background: blue;
|
||||
}
|
||||
nav {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 0 auto;
|
||||
background: gold;
|
||||
}
|
||||
</style>
|
||||
<section><nav></nav></section>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: gold;
|
||||
}
|
||||
nav {
|
||||
position: absolute;
|
||||
width: 200px;
|
||||
height: 100px;
|
||||
top: 0;
|
||||
left: 100px;
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
<section></section><nav></nav>
|
||||
|
31
tests/wpt/mozilla/tests/css/inline_block_margin_ref.html
Normal file
31
tests/wpt/mozilla/tests/css/inline_block_margin_ref.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
.yellow {
|
||||
background-color: #ff0;
|
||||
}
|
||||
.grey {
|
||||
background-color: #eee;
|
||||
}
|
||||
.d1 {
|
||||
position: absolute;
|
||||
left: 32px;
|
||||
top: 32px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.d2 {
|
||||
position: absolute;
|
||||
left: 132px;
|
||||
top: 32px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="d1 grey"></div>
|
||||
<div class="d2 yellow"></div>
|
||||
</body>
|
||||
</html>
|
27
tests/wpt/mozilla/tests/css/inline_block_min_width.html
Normal file
27
tests/wpt/mozilla/tests/css/inline_block_min_width.html
Normal file
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_min_width_ref.html'>
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
div {
|
||||
display: inline-block;
|
||||
min-width: 200px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.red {
|
||||
background-color: red;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="red"></div><div class="green"></div>
|
||||
</body>
|
||||
</html>
|
25
tests/wpt/mozilla/tests/css/inline_block_min_width_ref.html
Normal file
25
tests/wpt/mozilla/tests/css/inline_block_min_width_ref.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
div {
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
height: 100px;
|
||||
}
|
||||
.red {
|
||||
background-color: red;
|
||||
}
|
||||
.green {
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="red"></div><div class="green"></div>
|
||||
</body>
|
||||
</html>
|
7
tests/wpt/mozilla/tests/css/inline_block_overflow.html
Normal file
7
tests/wpt/mozilla/tests/css/inline_block_overflow.html
Normal file
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
|
||||
<html>
|
||||
<link rel='match' href='inline_block_overflow_ref.html'>
|
||||
<body>
|
||||
a<span style="display: inline-block; overflow: hidden">b</span>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel='match' href='inline_block_overflow_hidden_ref.html'>
|
||||
<body>
|
||||
<div style="display: inline-block; overflow: hidden">This should be visible</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<div style="display: inline-block">This should be visible</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
|
||||
<html>
|
||||
<body>
|
||||
ab
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_parent_padding_ref.html'>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
list-style-type: none;
|
||||
list-style-image: none;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
padding: 0 100px;
|
||||
color: red;
|
||||
background-color: yellow;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul><li>X</li></ul>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
div {
|
||||
float: left;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.red {
|
||||
background-color: red;
|
||||
}
|
||||
.yellow {
|
||||
background-color: yellow;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="yellow"></div>
|
||||
<div class="red"></div>
|
||||
<div class="yellow"></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_percentage_height_ref.html'>
|
||||
<title>Hello</title>
|
||||
</head>
|
||||
<body>
|
||||
<div style="height: 100px;">
|
||||
<span style="height: 100%;">
|
||||
<li style="height: 100%; background: red;"><span>Edit</span></li>
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Hello</title>
|
||||
</head>
|
||||
<body>
|
||||
<div style="height: 100px;">
|
||||
<div style="height: 100%;">
|
||||
<li style="height: 100%; background: red;"><span>Edit</span></li>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_stacking_context_ref.html'>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.fa {
|
||||
display: inline-block;
|
||||
transform: translate(0, 0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div style="padding: 100px 0 0 0;">
|
||||
<div class="fa">A</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.fa {
|
||||
display: block;
|
||||
transform: translate(0, 0);
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div style="padding: 100px 0 0 0;">
|
||||
<div class="fa">A</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
26
tests/wpt/mozilla/tests/css/inline_block_with_margin_a.html
Normal file
26
tests/wpt/mozilla/tests/css/inline_block_with_margin_a.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_block_with_margin_ref.html'>
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'ahem';
|
||||
font-size: 100px;
|
||||
line-height: 1;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
color: yellow;
|
||||
margin-left: 50px;
|
||||
margin-right: 50px;
|
||||
background: yellow;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div><span></span><span></span></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.block0 {
|
||||
position: absolute;
|
||||
background-color: yellow;
|
||||
left: 50px;
|
||||
top: 0px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.block1 {
|
||||
position: absolute;
|
||||
background-color: yellow;
|
||||
left: 250px;
|
||||
top: 0px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="block0"></div>
|
||||
<div class="block1"></div>
|
||||
</body>
|
||||
</html>
|
29
tests/wpt/mozilla/tests/css/inline_hypothetical_box_a.html
Normal file
29
tests/wpt/mozilla/tests/css/inline_hypothetical_box_a.html
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_hypothetical_box_ref.html'>
|
||||
<style>
|
||||
.a {
|
||||
position: relative;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.b {
|
||||
position: absolute;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.c {
|
||||
background: blue;
|
||||
display: inline-block;
|
||||
height: 8px;
|
||||
width: 32px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class=a><span class=c></span><span class=b style="top: 100px;">Hello</span>world!</div>
|
||||
<div class=a><span class=c></span><span class=b style="left: 100px;">Hello</span>world!</div>
|
||||
</body>
|
||||
</html>
|
||||
|
29
tests/wpt/mozilla/tests/css/inline_hypothetical_box_ref.html
Normal file
29
tests/wpt/mozilla/tests/css/inline_hypothetical_box_ref.html
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
.a {
|
||||
position: relative;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.b {
|
||||
position: absolute;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.c {
|
||||
background: blue;
|
||||
display: inline-block;
|
||||
height: 8px;
|
||||
width: 32px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class=a><span class=c></span>world!<span class=b style="top: 100px; left: 32px;">Hello</span></div>
|
||||
<div class=a><span class=c></span>world!<span class=b style="top: 0; left: 100px;">Hello</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_margin_multiple_fragments_ref.html'>
|
||||
<style>
|
||||
span {
|
||||
margin-left: 128px;
|
||||
margin-right: 128px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<span><img src=rust.png><img src=rust.png><img src=rust.png></span>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#first {
|
||||
margin-left: 128px;
|
||||
}
|
||||
#last {
|
||||
margin-right: 128px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<span id=first><img src=rust.png></span><img src=rust.png><span id=last><img src=rust.png></span>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='inline_margins_intrinsic_size_ref.html'>
|
||||
<style>
|
||||
span {
|
||||
margin: 0 1em;
|
||||
}
|
||||
div {
|
||||
float: left;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
<div>foo<span>/</span>bar</div>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
span {
|
||||
padding: 0 1em;
|
||||
}
|
||||
div {
|
||||
float: left;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
<div>foo<span>/</span>bar</div>
|
||||
|
25
tests/wpt/mozilla/tests/css/inline_text_align_a.html
Normal file
25
tests/wpt/mozilla/tests/css/inline_text_align_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='inline_text_align_b.html'>
|
||||
<style>
|
||||
.right {
|
||||
text-align: right;
|
||||
}
|
||||
.left {
|
||||
text-align: left;
|
||||
}
|
||||
.inline {
|
||||
display: inline;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="right">
|
||||
<span class="left"> <!-- should ignore 'text-align' of inline elements -->
|
||||
<div class="inline left"> <!-- ... and those explicitly defined as inline -->
|
||||
<span>hello, wide world</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
16
tests/wpt/mozilla/tests/css/inline_text_align_b.html
Normal file
16
tests/wpt/mozilla/tests/css/inline_text_align_b.html
Normal file
|
@ -0,0 +1,16 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
.right {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="right">
|
||||
<span class="right">
|
||||
hello, wide world
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
14
tests/wpt/mozilla/tests/css/input_button_margins_a.html
Normal file
14
tests/wpt/mozilla/tests/css/input_button_margins_a.html
Normal file
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='input_button_margins_ref.html'>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
}
|
||||
input {
|
||||
margin-left: 64px;
|
||||
border: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
</style>
|
||||
<input type=button value=Hello>
|
||||
|
13
tests/wpt/mozilla/tests/css/input_button_margins_ref.html
Normal file
13
tests/wpt/mozilla/tests/css/input_button_margins_ref.html
Normal file
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
}
|
||||
input {
|
||||
position: absolute;
|
||||
left: 64px;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
<input type=button value=Hello>
|
||||
|
10
tests/wpt/mozilla/tests/css/input_button_size_a.html
Normal file
10
tests/wpt/mozilla/tests/css/input_button_size_a.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='input_button_size_ref.html'>
|
||||
</head>
|
||||
<body>
|
||||
<input type=submit size=100 value=sumbit>
|
||||
</body>
|
||||
</html>
|
||||
|
9
tests/wpt/mozilla/tests/css/input_button_size_ref.html
Normal file
9
tests/wpt/mozilla/tests/css/input_button_size_ref.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
</head>
|
||||
<body>
|
||||
<input type=submit value=sumbit>
|
||||
</body>
|
||||
</html>
|
||||
|
26
tests/wpt/mozilla/tests/css/last_child_pseudo_a.html
Normal file
26
tests/wpt/mozilla/tests/css/last_child_pseudo_a.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='last_child_pseudo_b.html'>
|
||||
<title>:last-child test</title>
|
||||
<style type="text/css">
|
||||
html { background: red;}
|
||||
html:last-child { background: yellow; }
|
||||
|
||||
p { width: 20px; height: 20px; background: orange; float: left; margin-left: 10px; }
|
||||
div { clear: both; }
|
||||
#p1, #p2, #p3 { background: red; }
|
||||
#d1 > *:last-child { background: green }
|
||||
#d2 > *:last-child { background: green }
|
||||
#d3 > *:last-child { background: green }
|
||||
#p4 { background: green; }
|
||||
#d4 > *:last-child { background: red }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="d1"><p> </p><p id="p1"> </p></div>
|
||||
<div id="d2"><p> </p><p id="p2"> </p> </div>
|
||||
<div id="d3"><p> </p><p id="p3"> </p><!-- comment --></div>
|
||||
<div id="d4"><p> </p><p id="p4"> </p><span> </span></div>
|
||||
</body>
|
||||
</html>
|
22
tests/wpt/mozilla/tests/css/last_child_pseudo_b.html
Normal file
22
tests/wpt/mozilla/tests/css/last_child_pseudo_b.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>:last-child test</title>
|
||||
<style type="text/css">
|
||||
html { background: yellow;}
|
||||
|
||||
p { width: 20px; height: 20px; background: orange; float: left; margin-left: 10px; }
|
||||
div { clear: both; }
|
||||
#p1 { background: green; }
|
||||
#p2 { background: green; }
|
||||
#p3 { background: green; }
|
||||
#p4 { background: green; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="d1"><p> </p><p id="p1"> </p></div>
|
||||
<div id="d2"><p> </p><p id="p2"> </p> </div>
|
||||
<div id="d3"><p> </p><p id="p3"> </p><!-- comment --></div>
|
||||
<div id="d4"><p> </p><p id="p4"> </p><span> </span></div>
|
||||
</body>
|
||||
</html>
|
54
tests/wpt/mozilla/tests/css/last_of_type_pseudo_a.html
Normal file
54
tests/wpt/mozilla/tests/css/last_of_type_pseudo_a.html
Normal file
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='last_of_type_pseudo_b.html'>
|
||||
<title>:last-of-type test</title>
|
||||
<style type="text/css">
|
||||
html { background: red; }
|
||||
/* Should match according to Selectors Level 4 (changed from Level 3) */
|
||||
html:last-of-type { background: white; }
|
||||
|
||||
div > p,
|
||||
div > div,
|
||||
div > address {
|
||||
float: left;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 0px;
|
||||
margin-right: 10px;
|
||||
padding: 0px;
|
||||
}
|
||||
div > p {
|
||||
background: white;
|
||||
}
|
||||
div > div,
|
||||
div > address {
|
||||
background: black;
|
||||
}
|
||||
body > div { clear: both; margin-bottom: 10px; }
|
||||
|
||||
#d1 > .ok { background: red; }
|
||||
#d1 > *:last-of-type { background: green }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="d1">
|
||||
<p> </p>
|
||||
<div> </div>
|
||||
<div> </div>
|
||||
<p> </p>
|
||||
<address> </address>
|
||||
<p> </p>
|
||||
<div> </div>
|
||||
<p> </p>
|
||||
<p> </p>
|
||||
<address> </address>
|
||||
<address class="ok"> </address>
|
||||
<p> </p>
|
||||
<div class="ok"> </div>
|
||||
<p> </p>
|
||||
<p class="ok"> </p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
48
tests/wpt/mozilla/tests/css/last_of_type_pseudo_b.html
Normal file
48
tests/wpt/mozilla/tests/css/last_of_type_pseudo_b.html
Normal file
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>:last-of-type test</title>
|
||||
<style type="text/css">
|
||||
div > p,
|
||||
div > div,
|
||||
div > address {
|
||||
float: left;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 0px;
|
||||
margin-right: 10px;
|
||||
padding: 0px;
|
||||
}
|
||||
div > p {
|
||||
background: white;
|
||||
}
|
||||
div > div,
|
||||
div > address {
|
||||
background: black;
|
||||
}
|
||||
body > div { clear: both; margin-bottom: 10px; }
|
||||
|
||||
#d1 > .ok { background: green; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="d1">
|
||||
<p> </p>
|
||||
<div> </div>
|
||||
<div> </div>
|
||||
<p> </p>
|
||||
<address> </address>
|
||||
<p> </p>
|
||||
<div> </div>
|
||||
<p> </p>
|
||||
<p> </p>
|
||||
<address> </address>
|
||||
<address class="ok"> </address>
|
||||
<p> </p>
|
||||
<div class="ok"> </div>
|
||||
<p> </p>
|
||||
<p class="ok"> </p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='li_absolute_containing_block_ref.html'>
|
||||
<style>
|
||||
body {
|
||||
font-size: 64px;
|
||||
}
|
||||
li {
|
||||
position: relative;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
<li>X<section></section></li>
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
body {
|
||||
font-size: 64px;
|
||||
}
|
||||
div {
|
||||
position: relative;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
<div>X<section></section></div>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='line_breaking_whitespace_collapse_ref.html'>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
p {
|
||||
font-size: 10px;
|
||||
font-family: Ahem, monospace;
|
||||
width: 300px;
|
||||
}
|
||||
a {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>xxxxx xxxxx <a>xxxxx xxx xxxxx</a> xxxxxxxxxxx</p>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
p {
|
||||
font-size: 10px;
|
||||
font-family: Ahem, monospace;
|
||||
width: 300px;
|
||||
}
|
||||
a {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>xxxxx xxxxx <a>xxxxx xxx xxxxx</a><br>xxxxxxxxxxx</p>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='line_height_float_placement_ref.html'>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
font-size: 16px;
|
||||
font-family: Ahem;
|
||||
padding-top: 5px;
|
||||
}
|
||||
#floaty {
|
||||
float: left;
|
||||
height: 20px;
|
||||
width: 100px;
|
||||
}
|
||||
#pre {
|
||||
line-height: 32px;
|
||||
white-space: pre;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=floaty></div>
|
||||
<div id=pre>x
|
||||
x</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
font-size: 16px;
|
||||
font-family: Ahem, monospace;
|
||||
}
|
||||
#floaty {
|
||||
float: left;
|
||||
height: 20px;
|
||||
width: 100px;
|
||||
}
|
||||
#pre {
|
||||
white-space: pre;
|
||||
}
|
||||
.spacer {
|
||||
color: transparent;
|
||||
font-size: 32px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=floaty></div>
|
||||
<div id=pre>x<span class=spacer>x</span>
|
||||
x<span class=spacer>x</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
23
tests/wpt/mozilla/tests/css/linear_gradients_lengths_a.html
Normal file
23
tests/wpt/mozilla/tests/css/linear_gradients_lengths_a.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='linear_gradients_lengths_ref.html'>
|
||||
<!-- Tests that linear gradient lengths work. -->
|
||||
<style>
|
||||
section {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
}
|
||||
#a {
|
||||
background: linear-gradient(to right, white, white 30px, black 30px, black);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a></section>
|
||||
<section id=b></section>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<!-- Tests that linear gradient lengths work. -->
|
||||
<style>
|
||||
section {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
}
|
||||
#a {
|
||||
background: linear-gradient(to right, white, white 30%, black 30%, black);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a></section>
|
||||
<section id=b></section>
|
||||
</body>
|
||||
</html>
|
||||
|
29
tests/wpt/mozilla/tests/css/linear_gradients_parsing_a.html
Normal file
29
tests/wpt/mozilla/tests/css/linear_gradients_parsing_a.html
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='linear_gradients_parsing_ref.html'>
|
||||
<!-- Tests that parsing linear gradients works. -->
|
||||
<style>
|
||||
section {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
}
|
||||
#a {
|
||||
background: linear-gradient(to left, red, red);
|
||||
}
|
||||
#b {
|
||||
background: linear-gradient(#abacab, #abacab);
|
||||
}
|
||||
#c {
|
||||
background: linear-gradient(90deg, violet, violet 1em, violet 2ex, violet 50%, blue 50%, blue, blue);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a></section>
|
||||
<section id=b></section>
|
||||
<section id=c></section>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<!-- Tests that parsing linear gradients works. -->
|
||||
<style>
|
||||
section {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
position: relative;
|
||||
}
|
||||
#a {
|
||||
background: red;
|
||||
}
|
||||
#b {
|
||||
background: #abacab;
|
||||
}
|
||||
nav {
|
||||
display: block;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
#ca {
|
||||
background: violet;
|
||||
left: 0;
|
||||
}
|
||||
#cb {
|
||||
background: blue;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a></section>
|
||||
<section id=b></section>
|
||||
<section id=c>
|
||||
<nav id=ca></nav>
|
||||
<nav id=cb></nav>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
33
tests/wpt/mozilla/tests/css/linear_gradients_reverse_a.html
Normal file
33
tests/wpt/mozilla/tests/css/linear_gradients_reverse_a.html
Normal file
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='linear_gradients_reverse_ref.html'>
|
||||
<!-- Tests that reversed linear gradients are equivalent. -->
|
||||
<style>
|
||||
section {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
}
|
||||
#a {
|
||||
background: linear-gradient(to bottom, red, red 50%, green 50%, green);
|
||||
}
|
||||
#b {
|
||||
background: linear-gradient(90deg, black, white);
|
||||
}
|
||||
#c {
|
||||
background: linear-gradient(45deg, yellow, yellow 50%, purple 50%, purple);
|
||||
}
|
||||
#d {
|
||||
background: linear-gradient(to bottom right, lime, lime 50%, pink 50%, pink);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a></section>
|
||||
<section id=b></section>
|
||||
<section id=c></section>
|
||||
<section id=d></section>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<!-- Tests that reversed linear gradients are equivalent. -->
|
||||
<style>
|
||||
nav {
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid black 1px;
|
||||
}
|
||||
#a {
|
||||
background: linear-gradient(0deg, green, #008000 50%, red 50%, red);
|
||||
}
|
||||
#b {
|
||||
background: linear-gradient(to left, #ffffff, black);
|
||||
}
|
||||
#c {
|
||||
background: linear-gradient(225deg, purple, purple 50%, yellow 50%, yellow);
|
||||
}
|
||||
#d {
|
||||
background: linear-gradient(315deg, pink, pink 50%, lime 50%, lime);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav id=a></nav>
|
||||
<nav id=b></nav>
|
||||
<nav id=c></nav>
|
||||
<nav id=d></nav>
|
||||
</body>
|
||||
</html>
|
||||
|
25
tests/wpt/mozilla/tests/css/linebreak_inline_span_a.html
Normal file
25
tests/wpt/mozilla/tests/css/linebreak_inline_span_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='linebreak_inline_span_b.html'>
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<blockquote>
|
||||
The <span>most terrifying</span> fact about the universe <span>is not that
|
||||
it is hostile but that it is indifferent;</span> but if we can come to terms
|
||||
with this indifference and accept the<span> challenges</span> of <span>life
|
||||
<span>within</span></span> the boundaries of death - <span>however</span>
|
||||
mutable man may be able to make them - our existence as a species can have
|
||||
genuine meaning and fulfillment. However vast the darkness, we must supply
|
||||
our own light.
|
||||
<footer>
|
||||
<cite>Stanley Kubrick</cite>
|
||||
</footer>
|
||||
</blockquote>
|
||||
</body>
|
||||
</html>
|
23
tests/wpt/mozilla/tests/css/linebreak_inline_span_b.html
Normal file
23
tests/wpt/mozilla/tests/css/linebreak_inline_span_b.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
* {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<blockquote>
|
||||
The most terrifying fact about the universe is not that it is hostile but
|
||||
that it is indifferent; but if we can come to terms with this indifference
|
||||
and accept the challenges of life within the boundaries of death - however
|
||||
mutable man may be able to make them - our existence as a species can have
|
||||
genuine meaning and fulfillment. However vast the darkness, we must supply
|
||||
our own light.
|
||||
<footer>
|
||||
<cite>Stanley Kubrick</cite>
|
||||
</footer>
|
||||
</blockquote>
|
||||
</body>
|
||||
</html>
|
12
tests/wpt/mozilla/tests/css/link_style_order.html
Normal file
12
tests/wpt/mozilla/tests/css/link_style_order.html
Normal file
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='link_style_order_ref.html'>
|
||||
<meta charset="utf-8">
|
||||
<title>link/style order test</title>
|
||||
<link rel="stylesheet" href="data:text/css,body{background:red;}">
|
||||
<style>body { background: green; }</style>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
10
tests/wpt/mozilla/tests/css/link_style_order_ref.html
Normal file
10
tests/wpt/mozilla/tests/css/link_style_order_ref.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>link/style order test</title>
|
||||
<style>body { background: green; }</style>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
38
tests/wpt/mozilla/tests/css/list_style_image_sizing_a.html
Normal file
38
tests/wpt/mozilla/tests/css/list_style_image_sizing_a.html
Normal file
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='list_style_image_sizing_ref.html'>
|
||||
<!--
|
||||
Tests that the list style image doesn't get stretched vertically. It should be completely
|
||||
covered up by the black absolutely-positioned div.
|
||||
-->
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
margin-left: 128px;
|
||||
list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAANAQMAAABb8jbLAAAABlBMVEX///8AUow5QSOjAAAAAXRSTlMAQObYZgAAABNJREFUCB1jYEABBQw/wLCAgQEAGpIDyT0IVcsAAAAASUVORK5CYII=);
|
||||
font-size: 256px;
|
||||
font-family: Ahem, monospace;
|
||||
}
|
||||
#coverup {
|
||||
position: absolute;
|
||||
background: black;
|
||||
top: 176px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>x</li>
|
||||
</ul>
|
||||
<div id=coverup></div>
|
||||
</body>
|
||||
</html>
|
||||
|
37
tests/wpt/mozilla/tests/css/list_style_image_sizing_ref.html
Normal file
37
tests/wpt/mozilla/tests/css/list_style_image_sizing_ref.html
Normal file
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<!--
|
||||
Tests that the list style image doesn't get stretched vertically. It should be completely
|
||||
covered up by the black absolutely-positioned div.
|
||||
-->
|
||||
<link rel="stylesheet" type="text/css" href="css/ahem.css">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
margin-left: 128px;
|
||||
list-style-image: none;
|
||||
font-size: 256px;
|
||||
font-family: Ahem, monospace;
|
||||
}
|
||||
#coverup {
|
||||
position: absolute;
|
||||
background: black;
|
||||
top: 176px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<ul>
|
||||
<li>x</li>
|
||||
</ul>
|
||||
<div id=coverup></div>
|
||||
</body>
|
||||
</html>
|
||||
|
7
tests/wpt/mozilla/tests/css/many_brs_a.html
Normal file
7
tests/wpt/mozilla/tests/css/many_brs_a.html
Normal file
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel='match' href='many_brs_ref.html'>
|
||||
<body>
|
||||
Cupcakes<br>are<br>supremely<br>delicious.
|
||||
</body>
|
||||
</html>
|
9
tests/wpt/mozilla/tests/css/many_brs_ref.html
Normal file
9
tests/wpt/mozilla/tests/css/many_brs_ref.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<div>Cupcakes</div>
|
||||
<div>are</div>
|
||||
<div>supremely</div>
|
||||
<div>delicious.</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel='match' href='margin_padding_inline_block_ref.html'>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
<div><span style="padding-left: 100px; display: inline-block">Boo</span></div>
|
||||
<div><span style="padding-left: 100px">Foo</span></div>
|
||||
<div><span style="margin-left: 100px">Foo</span></div>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
div {
|
||||
position: relative;
|
||||
}
|
||||
span {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
}
|
||||
</style>
|
||||
<div><span>Boo</span></div>
|
||||
<div><span>Foo</span></div>
|
||||
<div><span>Foo</span></div>
|
||||
|
11
tests/wpt/mozilla/tests/css/margins_inside_floats_a.html
Normal file
11
tests/wpt/mozilla/tests/css/margins_inside_floats_a.html
Normal file
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel='match' href='margins_inside_floats_ref.html'>
|
||||
<body>
|
||||
<div style="float: left;">
|
||||
<div style="margin-bottom: 64px;">Must be this tall</div>
|
||||
<div style="margin-top: 64px;">to write multi-threaded code.</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
10
tests/wpt/mozilla/tests/css/margins_inside_floats_ref.html
Normal file
10
tests/wpt/mozilla/tests/css/margins_inside_floats_ref.html
Normal file
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<div>
|
||||
<div style="margin-bottom: 64px;">Must be this tall</div>
|
||||
<div style="margin-top: 64px;">to write multi-threaded code.</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
25
tests/wpt/mozilla/tests/css/max_width_float_simple_a.html
Normal file
25
tests/wpt/mozilla/tests/css/max_width_float_simple_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='max_width_float_simple_b.html'>
|
||||
<style>
|
||||
#first {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#float {
|
||||
float: left;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
max-width: 40px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="float">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
22
tests/wpt/mozilla/tests/css/max_width_float_simple_b.html
Normal file
22
tests/wpt/mozilla/tests/css/max_width_float_simple_b.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#first {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 40px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
25
tests/wpt/mozilla/tests/css/max_width_simple_a.html
Normal file
25
tests/wpt/mozilla/tests/css/max_width_simple_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='max_width_simple_b.html'>
|
||||
<style>
|
||||
#first {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 50%;
|
||||
max-width: 40px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
22
tests/wpt/mozilla/tests/css/max_width_simple_b.html
Normal file
22
tests/wpt/mozilla/tests/css/max_width_simple_b.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#first {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 40px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
34
tests/wpt/mozilla/tests/css/min_max_height_a.html
Normal file
34
tests/wpt/mozilla/tests/css/min_max_height_a.html
Normal file
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='min_max_height_b.html'>
|
||||
<title>You see here a scroll labeled VE FORBRYDERNE.</title>
|
||||
<style>
|
||||
div {
|
||||
width: 50px;
|
||||
}
|
||||
#a {
|
||||
background: red;
|
||||
height: 50px;
|
||||
min-height: 100px;
|
||||
}
|
||||
#b {
|
||||
background: green;
|
||||
height: 100px;
|
||||
max-height: 50px;
|
||||
}
|
||||
#c {
|
||||
background: blue;
|
||||
height: 50px;
|
||||
min-height: 100px; /* <-- this one overrides per the spec */
|
||||
max-height: 25px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=a></div>
|
||||
<div id=b></div>
|
||||
<div id=c></div>
|
||||
</body>
|
||||
</html>
|
||||
|
29
tests/wpt/mozilla/tests/css/min_max_height_b.html
Normal file
29
tests/wpt/mozilla/tests/css/min_max_height_b.html
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>You see here a scroll labeled VE FORBRYDERNE.</title>
|
||||
<style>
|
||||
div {
|
||||
width: 50px;
|
||||
}
|
||||
#a {
|
||||
background: red;
|
||||
height: 100px;
|
||||
}
|
||||
#b {
|
||||
background: green;
|
||||
height: 50px;
|
||||
}
|
||||
#c {
|
||||
background: blue;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=a></div>
|
||||
<div id=b></div>
|
||||
<div id=c></div>
|
||||
</body>
|
||||
</html>
|
||||
|
26
tests/wpt/mozilla/tests/css/min_width_float_simple_a.html
Normal file
26
tests/wpt/mozilla/tests/css/min_width_float_simple_a.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='min_width_float_simple_b.html'>
|
||||
<style>
|
||||
#first {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#float {
|
||||
float: left;
|
||||
height: 50px;
|
||||
width: 50%;
|
||||
min-width: 60px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="float">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
22
tests/wpt/mozilla/tests/css/min_width_float_simple_b.html
Normal file
22
tests/wpt/mozilla/tests/css/min_width_float_simple_b.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#first {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 60px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
25
tests/wpt/mozilla/tests/css/min_width_simple_a.html
Normal file
25
tests/wpt/mozilla/tests/css/min_width_simple_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='min_width_simple_b.html'>
|
||||
<style>
|
||||
#first {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 50%;
|
||||
min-width: 60px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
22
tests/wpt/mozilla/tests/css/min_width_simple_b.html
Normal file
22
tests/wpt/mozilla/tests/css/min_width_simple_b.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#first {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: solid 1px;
|
||||
}
|
||||
#block {
|
||||
height: 50px;
|
||||
width: 60px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="first">
|
||||
<div id="block">
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
18
tests/wpt/mozilla/tests/css/minimum_line_height_a.html
Normal file
18
tests/wpt/mozilla/tests/css/minimum_line_height_a.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel='match' href='minimum_line_height_b.html'>
|
||||
<head>
|
||||
<style>
|
||||
#a {
|
||||
line-height: 100px;
|
||||
}
|
||||
|
||||
#b {
|
||||
line-height: 6px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div id=a><span id=b>Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal. Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battle-field of that war. We have come to dedicate a portion of that field, as a final resting place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this.</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
17
tests/wpt/mozilla/tests/css/minimum_line_height_b.html
Normal file
17
tests/wpt/mozilla/tests/css/minimum_line_height_b.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
#a {
|
||||
line-height: 100px;
|
||||
}
|
||||
|
||||
#b {
|
||||
line-height: 100px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div id=a><span id=b>Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal. Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battle-field of that war. We have come to dedicate a portion of that field, as a final resting place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this.</span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
54
tests/wpt/mozilla/tests/css/mix_blend_mode_a.html
Normal file
54
tests/wpt/mozilla/tests/css/mix_blend_mode_a.html
Normal file
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='mix_blend_mode_ref.html'>
|
||||
<style>
|
||||
html {
|
||||
background: #ffffff;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#a {
|
||||
top: 0;
|
||||
mix-blend-mode: difference;
|
||||
}
|
||||
#b {
|
||||
top: 100px;
|
||||
mix-blend-mode: exclusion;
|
||||
}
|
||||
div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.red {
|
||||
left: 0;
|
||||
background-color: #ff0000;
|
||||
}
|
||||
.green {
|
||||
left: 100px;
|
||||
background: #00ff00;
|
||||
}
|
||||
.blue {
|
||||
left: 200px;
|
||||
background: #0000ff;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a>
|
||||
<div class=red></div>
|
||||
<div class=green></div>
|
||||
<div class=blue></div>
|
||||
</section>
|
||||
<section id=b>
|
||||
<div class=red></div>
|
||||
<div class=green></div>
|
||||
<div class=blue></div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
52
tests/wpt/mozilla/tests/css/mix_blend_mode_ref.html
Normal file
52
tests/wpt/mozilla/tests/css/mix_blend_mode_ref.html
Normal file
|
@ -0,0 +1,52 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
html {
|
||||
background: #ffffff;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
#a {
|
||||
top: 0;
|
||||
}
|
||||
#b {
|
||||
top: 100px;
|
||||
}
|
||||
div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.red {
|
||||
left: 0;
|
||||
background-color: #00ffff;
|
||||
}
|
||||
.green {
|
||||
left: 100px;
|
||||
background: #ff00ff;
|
||||
}
|
||||
.blue {
|
||||
left: 200px;
|
||||
background: #ffff00;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section id=a>
|
||||
<div class=red></div>
|
||||
<div class=green></div>
|
||||
<div class=blue></div>
|
||||
</section>
|
||||
<section id=b>
|
||||
<div class=red></div>
|
||||
<div class=green></div>
|
||||
<div class=blue></div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
20
tests/wpt/mozilla/tests/css/multiple_css_class_a.html
Normal file
20
tests/wpt/mozilla/tests/css/multiple_css_class_a.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel='match' href='multiple_css_class_b.html'>
|
||||
<style>
|
||||
.foo {
|
||||
height: 100px;
|
||||
}
|
||||
.bar {
|
||||
width: 100px;
|
||||
}
|
||||
.baz {
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="foo bar baz foobar">
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
15
tests/wpt/mozilla/tests/css/multiple_css_class_b.html
Normal file
15
tests/wpt/mozilla/tests/css/multiple_css_class_b.html
Normal file
|
@ -0,0 +1,15 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
.bar {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="foo bar baz foobar">
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
32
tests/wpt/mozilla/tests/css/negative_margin_uncle_a.html
Normal file
32
tests/wpt/mozilla/tests/css/negative_margin_uncle_a.html
Normal file
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='negative_margin_uncle_b.html'>
|
||||
<title>You see here a scroll labeled KERNOD WEL.</title>
|
||||
<style>
|
||||
body {
|
||||
font-size: 40px;
|
||||
}
|
||||
#d {
|
||||
float: right;
|
||||
background: green;
|
||||
color: white;
|
||||
}
|
||||
#b {
|
||||
margin: 0 0 -100px 0;
|
||||
}
|
||||
#c {
|
||||
margin: 100px 0 0 0;
|
||||
clear: both;
|
||||
background-color: blue;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=d>Beetlejuice</div>
|
||||
<div id=a><div id=b>Beetlejuice</div></div>
|
||||
<div id=c>Beetlejuice</div>
|
||||
</body>
|
||||
</html>
|
||||
|
27
tests/wpt/mozilla/tests/css/negative_margin_uncle_b.html
Normal file
27
tests/wpt/mozilla/tests/css/negative_margin_uncle_b.html
Normal file
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>You see here a scroll labeled KERNOD WEL.</title>
|
||||
<style>
|
||||
body {
|
||||
font-size: 40px;
|
||||
}
|
||||
#d {
|
||||
float: right;
|
||||
background: green;
|
||||
color: white;
|
||||
}
|
||||
#c {
|
||||
clear: both;
|
||||
background-color: blue;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=d>Beetlejuice</div>
|
||||
<div id=a>Beetlejuice</div>
|
||||
<div id=c>Beetlejuice</div>
|
||||
</body>
|
||||
</html>
|
||||
|
19
tests/wpt/mozilla/tests/css/negative_margins_a.html
Normal file
19
tests/wpt/mozilla/tests/css/negative_margins_a.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel='match' href='negative_margins_b.html'>
|
||||
<style>
|
||||
* {
|
||||
line-height: 14px;
|
||||
}
|
||||
#b {
|
||||
margin-top: -14px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=a>X</div>
|
||||
<div id=b>X</div>
|
||||
</body>
|
||||
</html>
|
||||
|
24
tests/wpt/mozilla/tests/css/negative_margins_b.html
Normal file
24
tests/wpt/mozilla/tests/css/negative_margins_b.html
Normal file
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
* {
|
||||
line-height: 14px;
|
||||
}
|
||||
#a {
|
||||
position: relative;
|
||||
}
|
||||
#b {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id=a>X
|
||||
<div id=b>X</div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
1
tests/wpt/mozilla/tests/css/no-image-ref.html
Normal file
1
tests/wpt/mozilla/tests/css/no-image-ref.html
Normal file
|
@ -0,0 +1 @@
|
|||
<img width="100px" height="100px" src="rippy.jpg">
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue