mirror of
https://github.com/servo/servo.git
synced 2025-08-08 06:55:31 +01:00
Update web-platform-tests to revision b'7af9d6ec48ab04043a2bea85a3599904a1a19efa'
This commit is contained in:
WPT Sync Bot
Josh Matthews
parent
8050c95e31
commit
87be1008de
2742 changed files with 142451 additions and 40667 deletions
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for calc() on background-image gradients</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
}
|
||||
|
||||
#one { background-image: radial-gradient(circle farthest-side at 150px 20px, red, green); }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for calc() on background-image gradients</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-background-image-gradient-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
}
|
||||
|
||||
#one { background-image: radial-gradient(circle farthest-side at calc(50px + 50%) calc(100% - 30px), red, green); }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Reference: Support calc() on gradient stop positions</title>
|
||||
<link rel="author" title="Yu-Sian (Thomasy) Liu" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594935">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
div {
|
||||
width:100px;
|
||||
height:100px;
|
||||
background:red;
|
||||
margin:5px 0 0 5px;
|
||||
float:left;
|
||||
}
|
||||
div#one {
|
||||
background: linear-gradient(lime 0px, lime 90px, blue 90px, blue 100%);
|
||||
}
|
||||
div#two {
|
||||
background: linear-gradient(blue 0px ,green 30px ,red 40px ,white 60px , lime 80px);
|
||||
}
|
||||
div#three {
|
||||
background: linear-gradient(blue 0px ,purple 20px ,red 40px ,blue 60px , lime 80px);
|
||||
}
|
||||
div#four {
|
||||
background: linear-gradient(blue 0px ,green 30px ,red 40px ,blue 60px , yellow 80px);
|
||||
}
|
||||
div#five {
|
||||
background: linear-gradient(red 0px ,green 30px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="one">1</div>
|
||||
<div id="two">2</div>
|
||||
<div id="three">3</div>
|
||||
<div id="four">4</div>
|
||||
<div id="five">5</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Test: Support calc() on gradient stop positions</title>
|
||||
<link rel="author" title="Yu-Sian (Thomasy) Liu" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594935">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-background-linear-gradient-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
div {
|
||||
width:100px;
|
||||
height:100px;
|
||||
background:red;
|
||||
margin:5px 0 0 5px;
|
||||
float:left;
|
||||
}
|
||||
div#one {
|
||||
background: linear-gradient(lime 0px, lime calc(100% - 10px), blue calc(100% - 10px), blue 100%);
|
||||
}
|
||||
div#two {
|
||||
background: linear-gradient(blue calc(100% - 100px) ,green calc(10% + 20px) ,red 40px ,white calc(100% - 40px) , lime 80px);
|
||||
}
|
||||
div#three {
|
||||
background: linear-gradient(blue calc(0px) ,purple calc(20%) ,red calc(10px + 10px + 20px) ,blue calc(30% + 30px) , lime calc(180% - 100px));
|
||||
}
|
||||
div#four {
|
||||
background: linear-gradient(blue calc(0% + 0px) ,green calc(10% + 20px) ,red 40px ,blue calc(200% / 2 - 40px) , yellow 80px);
|
||||
}
|
||||
div#five {
|
||||
background: linear-gradient(red calc(100% - 100px) ,green calc(10% + 20px));
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="one">1</div>
|
||||
<div id="two">2</div>
|
||||
<div id="three">3</div>
|
||||
<div id="four">4</div>
|
||||
<div id="five">5</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for calc() on background-position</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
background-image: url(support/blue-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#one { background-position: 134px -12px }
|
||||
#two { background-position: -18px -19px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
<p id="two"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for calc() on background-position</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-background-position-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
background-image: url(support/blue-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#one { background-position: calc(50px + 50%) calc(100% - 30px) }
|
||||
#two { background-position: calc(-12.5% + 3px) calc(-10px - 50%) }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
<p id="two"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for calc() on background-size</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
background-image: url(support/blue-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#one { background-size: 150px 20px; }
|
||||
#two { background-image: none }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
<p id="two"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for calc() on background-size</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-background-size-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
border: thin solid;
|
||||
background-image: url(support/blue-32x32.png);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#one { background-size: calc(50px + 50%) calc(100% - 30px) }
|
||||
#two { background-size: calc(50px + 50%) calc(10px - 50%) }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one"></p>
|
||||
<p id="two"></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: test for border-radius: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
height: 256px;
|
||||
width: 512px;
|
||||
background: blue;
|
||||
border-radius: 21px 6px 12px 29px / 5px 16px 10px 3px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: test for border-radius: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-border-radius-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
p {
|
||||
/* We use powers of two here to avoid floating-point issues.
|
||||
See bug 590181. */
|
||||
|
||||
height: 256px;
|
||||
width: 512px;
|
||||
background: blue;
|
||||
border-radius: calc((1/32 * 100%) + 5px)
|
||||
calc((1/64 * 100%) - 2px)
|
||||
calc(10px + (1/256 * 100%))
|
||||
calc((1/16 * 100%) - 3px) /
|
||||
calc((1/32 * 100%) - (1px + (1/128 * 100%)))
|
||||
calc(1/16 * 100%)
|
||||
calc(10px)
|
||||
3px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for height:calc() or min-height:calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; width: 1px; background: blue; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 75px"></div>
|
||||
<div style="height: 45px"></div>
|
||||
<div style="height: 40px"></div>
|
||||
<div style="height: 30px"></div>
|
||||
|
||||
<!-- tests with an auto-height container -->
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 10px"></div>
|
||||
<div style="height: 10px"></div>
|
||||
<div style="height: 10px"></div>
|
||||
<div style="height: 10px"></div>
|
||||
<div style="height: 10px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for height:calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-height-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 1px; }
|
||||
body > div > div { background: blue }
|
||||
|
||||
/* for auto-height tests */
|
||||
body > div > div > div > div { height: 10px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="height: calc(50px)"></div></div>
|
||||
<div><div style="height: calc(50%)"></div></div>
|
||||
<div><div style="height: calc(25px + 50%)"></div></div>
|
||||
<div><div style="height: calc(150% / 2 - 30px)"></div></div>
|
||||
<div><div style="height: calc(40px + 10% - 20% / 2)"></div></div>
|
||||
<div><div style="height: calc(40px - 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-height container -->
|
||||
<div><div><div style="height: calc(50px)"><div></div></div></div></div>
|
||||
<div><div><div style="height: calc(50%)"><div></div></div></div></div>
|
||||
<div><div><div style="height: calc(25px + 50%)"><div></div></div></div></div>
|
||||
<div><div><div style="height: calc(150% / 2 - 30px)"><div></div></div></div></div>
|
||||
<div><div><div style="height: calc(40px + 10% - 20% / 2)"><div></div></div></div></div>
|
||||
<div><div><div style="height: calc(40px - 10%)"><div></div></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test that height:calc() with no percentages has an effect on inner table elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
tbody, tr, td {
|
||||
height: 500px;
|
||||
min-height: 700px;
|
||||
max-height: 2px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table border>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>cell</td>
|
||||
<td>cell</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>cell</td>
|
||||
<td>cell</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test that height:calc() with no percentages has an effect on inner table elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-height-table-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
tbody, tr, td {
|
||||
height: calc(500px);
|
||||
min-height: calc(700px);
|
||||
max-height: calc(2px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table border>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>cell</td>
|
||||
<td>cell</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>cell</td>
|
||||
<td>cell</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test of margin-*: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
div { border: medium solid green; width: 500px }
|
||||
p { background: yellow }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><p style="margin: 15px 0 0 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 15px 0 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 0 15px 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 0 0 15px">paragraph with margin</p></div>
|
||||
<div><p style="margin: 25px 25px 25px 25px">paragraph with margin</p></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test of margin-*: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-margin-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
div { border: medium solid green; width: 500px }
|
||||
p { background: yellow }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><p style="margin: calc(10px + 1%) 0 0 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 calc(10px + 1%) 0 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 0 calc(10px + 1%) 0">paragraph with margin</p></div>
|
||||
<div><p style="margin: 0 0 0 calc(10px + 1%)">paragraph with margin</p></div>
|
||||
<div><p style="margin: calc(30px - 1%)">paragraph with margin</p></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for max-height:calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; width: 1px; background: blue; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 75px"></div>
|
||||
<div style="height: 45px"></div>
|
||||
<div style="height: 40px"></div>
|
||||
<div style="height: 30px"></div>
|
||||
|
||||
<!-- tests with an auto-height container -->
|
||||
<div style="height: 50px"></div>
|
||||
<div style="height: 300px"></div>
|
||||
<div style="height: 300px"></div>
|
||||
<div style="height: 300px"></div>
|
||||
<div style="height: 300px"></div>
|
||||
<div style="height: 300px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for max-height:calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-max-height-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 1px; }
|
||||
body > div > div { background: blue }
|
||||
|
||||
/* to give the max-height something to restrict */
|
||||
span { display: block; height: 300px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="max-height: calc(50px)"><span></span></div></div>
|
||||
<div><div style="max-height: calc(50%)"><span></span></div></div>
|
||||
<div><div style="max-height: calc(25px + 50%)"><span></span></div></div>
|
||||
<div><div style="max-height: calc(150% / 2 - 30px)"><span></span></div></div>
|
||||
<div><div style="max-height: calc(40px + 10% - 20% / 2)"><span></span></div></div>
|
||||
<div><div style="max-height: calc(40px - 10%)"><span></span></div></div>
|
||||
|
||||
<!-- tests with an auto-height container -->
|
||||
<div><div><div style="max-height: calc(50px)"><span></span></div></div></div>
|
||||
<div><div><div style="max-height: calc(50%)"><span></span></div></div></div>
|
||||
<div><div><div style="max-height: calc(25px + 50%)"><span></span></div></div></div>
|
||||
<div><div><div style="max-height: calc(150% / 2 - 30px)"><span></span></div></div></div>
|
||||
<div><div><div style="max-height: calc(40px + 10% - 20% / 2)"><span></span></div></div></div>
|
||||
<div><div><div style="max-height: calc(40px - 10%)"><span></span></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: max-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { background: green; color: white; margin: 1px 0; font-size: 10px; width: 1000px; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="max-width: calc(50% - 3px)">50% - 3px</p>
|
||||
<p style="max-width: calc(25% - 3px + 25%)">25% - 3px + 25%</p>
|
||||
<p style="max-width: calc(25% - 3px + 12.5% * 2)">25% - 3px + 12.5% * 2</p>
|
||||
<p style="max-width: calc(25% - 3px + 12.5%*2)">25% - 3px + 12.5%*2</p>
|
||||
<p style="max-width: calc(25% - 3px + 2*12.5%)">25% - 3px + 2*12.5%</p>
|
||||
<p style="max-width: calc(25% - 3px + 2 * 12.5%)">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="max-width: calc(30% + 20%)">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: intrinsic width of max-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body > div { margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="width: 400px"></div>
|
||||
<div style="width: 47px"></div>
|
||||
<div style="width: 400px"></div>
|
||||
<div style="width: 400px"></div>
|
||||
<div style="width: 50px"></div>
|
||||
<div style="width: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: intrinsic width of max-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-max-width-block-intrinsic-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { font-size: 10px }
|
||||
body > div { float: left; clear: left;
|
||||
margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
body > div > div { width: 400px }
|
||||
body > div > div > div { width: 200px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><div style="max-width: calc(50% - 3px)"><div></div></div></div>
|
||||
<div><div style="max-width: calc(5em - 3px)"><div></div></div></div>
|
||||
<div><div style="max-width: calc(5em - 0%)"><div></div></div></div>
|
||||
<div><div style="max-width: calc(50%)"><div></div></div></div>
|
||||
<div><div style="max-width: calc(50px)"><div></div></div></div>
|
||||
<div><div style="max-width: calc(25% + 25%)"><div></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for min-height:calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-height-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 1px; }
|
||||
body > div > div { background: blue }
|
||||
|
||||
/* for auto-height tests */
|
||||
body > div > div > div > div { height: 10px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="min-height: calc(50px)"></div></div>
|
||||
<div><div style="min-height: calc(50%)"></div></div>
|
||||
<div><div style="min-height: calc(25px + 50%)"></div></div>
|
||||
<div><div style="min-height: calc(150% / 2 - 30px)"></div></div>
|
||||
<div><div style="min-height: calc(40px + 10% - 20% / 2)"></div></div>
|
||||
<div><div style="min-height: calc(40px - 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-height container -->
|
||||
<div><div><div style="min-height: calc(50px)"><div></div></div></div></div>
|
||||
<div><div><div style="min-height: calc(50%)"><div></div></div></div></div>
|
||||
<div><div><div style="min-height: calc(25px + 50%)"><div></div></div></div></div>
|
||||
<div><div><div style="min-height: calc(150% / 2 - 30px)"><div></div></div></div></div>
|
||||
<div><div><div style="min-height: calc(40px + 10% - 20% / 2)"><div></div></div></div></div>
|
||||
<div><div><div style="min-height: calc(40px - 10%)"><div></div></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: min-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { background: green; color: white; margin: 1px 0; font-size: 10px; width: 0 }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="min-width: calc(50% - 3px)">50% - 3px</p>
|
||||
<p style="min-width: calc(25% - 3px + 25%)">25% - 3px + 25%</p>
|
||||
<p style="min-width: calc(25% - 3px + 12.5% * 2)">25% - 3px + 12.5% * 2</p>
|
||||
<p style="min-width: calc(25% - 3px + 12.5%*2)">25% - 3px + 12.5%*2</p>
|
||||
<p style="min-width: calc(25% - 3px + 2*12.5%)">25% - 3px + 2*12.5%</p>
|
||||
<p style="min-width: calc(25% - 3px + 2 * 12.5%)">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="min-width: calc(30% + 20%)">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: intrinsic width of min-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body > div { margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="width: 1px"></div>
|
||||
<div style="width: 47px"></div>
|
||||
<div style="width: 1px"></div>
|
||||
<div style="width: 1px"></div>
|
||||
<div style="width: 50px"></div>
|
||||
<div style="width: 1px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: intrinsic width of min-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-min-width-block-intrinsic-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { font-size: 10px }
|
||||
body > div { float: left; clear: left;
|
||||
margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
body > div > div { width: 1px }
|
||||
body > div > div > div { width: 200px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><div style="min-width: calc(50% - 3px)"><div></div></div></div>
|
||||
<div><div style="min-width: calc(5em - 3px)"><div></div></div></div>
|
||||
<div><div style="min-width: calc(5em - 0%)"><div></div></div></div>
|
||||
<div><div style="min-width: calc(50%)"><div></div></div></div>
|
||||
<div><div style="min-width: calc(50px)"><div></div></div></div>
|
||||
<div><div style="min-width: calc(25% + 25%)"><div></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for bottom:calc() on absolutely positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-absolute-top-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; margin-top: -90px; height: 100px; margin-bottom: 90px; width: 3px; position: relative }
|
||||
div[style] { background: blue; position: absolute; height: 10px; width: 3px }
|
||||
div.space { height: 100px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="bottom: calc(-50px)"></div></div>
|
||||
<div><div style="bottom: calc(-50%)"></div></div>
|
||||
<div><div style="bottom: calc(-25px - 50%)"></div></div>
|
||||
<div><div style="bottom: calc(-150% / 2 + 30px)"></div></div>
|
||||
<div><div style="bottom: calc(-40px - 10% + 20% / 2)"></div></div>
|
||||
<div><div style="bottom: calc(-40px + 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-bottom container -->
|
||||
<div><div><div style="bottom: calc(-50px)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-50%)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-25px - 50%)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-150% / 2 + 30px)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-40px - 10% + 20% / 2)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-40px + 10%)"></div><div class="space"></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for left:calc() on absolutely positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-left-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 100px; width: 200px }
|
||||
body > div { height: 3px; position: relative }
|
||||
div[style] { background: blue; position: absolute; height: 3px; width: 100px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><div style="left: calc(50px)"></div></div>
|
||||
<div><div style="left: calc(-25%)"></div></div>
|
||||
<div><div style="left: calc(25px + 25%)"></div></div>
|
||||
<div><div style="left: calc(-75% / 2 + 30px)"></div></div>
|
||||
<div><div style="left: calc(40px + 5% - 10% / 2)"></div></div>
|
||||
<div><div style="left: calc(5% - 40px)"></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for right:calc() on absolutely positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-left-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0; width: 200px }
|
||||
body > div { height: 3px; position: relative }
|
||||
div[style] { background: blue; position: absolute; height: 3px; width: 100px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><div style="right: calc(-50px)"></div></div>
|
||||
<div><div style="right: calc(25%)"></div></div>
|
||||
<div><div style="right: calc(-25px - 25%)"></div></div>
|
||||
<div><div style="right: calc(75% / 2 - 30px)"></div></div>
|
||||
<div><div style="right: calc(-40px - 5% + 10% / 2)"></div></div>
|
||||
<div><div style="right: calc(-5% + 40px)"></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for top:calc() on absolutely positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 3px; }
|
||||
div[style] { background: blue; position: relative; height: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 75px"></div></div>
|
||||
<div><div style="top: 45px"></div></div>
|
||||
<div><div style="top: 40px"></div></div>
|
||||
<div><div style="top: 30px"></div></div>
|
||||
|
||||
<!-- tests with an auto-top container -->
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 75px"></div></div>
|
||||
<div><div style="top: 45px"></div></div>
|
||||
<div><div style="top: 40px"></div></div>
|
||||
<div><div style="top: 30px"></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for top:calc() on absolutely positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-absolute-top-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 3px; position: relative }
|
||||
div[style] { background: blue; position: absolute; height: 10px; width: 3px }
|
||||
div.space { height: 100px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="top: calc(50px)"></div></div>
|
||||
<div><div style="top: calc(50%)"></div></div>
|
||||
<div><div style="top: calc(25px + 50%)"></div></div>
|
||||
<div><div style="top: calc(150% / 2 - 30px)"></div></div>
|
||||
<div><div style="top: calc(40px + 10% - 20% / 2)"></div></div>
|
||||
<div><div style="top: calc(40px - 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-top container -->
|
||||
<div><div><div style="top: calc(50px)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="top: calc(50%)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="top: calc(25px + 50%)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="top: calc(150% / 2 - 30px)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="top: calc(40px + 10% - 20% / 2)"></div><div class="space"></div></div></div>
|
||||
<div><div><div style="top: calc(40px - 10%)"></div><div class="space"></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for bottom:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-top-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 3px; }
|
||||
div[style] { background: blue; position: relative; height: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="bottom: calc(-50px)"></div></div>
|
||||
<div><div style="bottom: calc(-50%)"></div></div>
|
||||
<div><div style="bottom: calc(-25px - 50%)"></div></div>
|
||||
<div><div style="bottom: calc(-150% / 2 + 30px)"></div></div>
|
||||
<div><div style="bottom: calc(-40px - 10% + 20% / 2)"></div></div>
|
||||
<div><div style="bottom: calc(-40px + 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-top container -->
|
||||
<div><div><div style="bottom: calc(-50px)"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-50%)"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-25px - 50%)"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-150% / 2 + 30px)"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-40px - 10% + 20% / 2)"></div></div></div>
|
||||
<div><div><div style="bottom: calc(-40px + 10%)"></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for left:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 100px; width: 100px }
|
||||
div[style] { background: blue; position: relative; height: 3px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="left: 50px"></div>
|
||||
<div style="left: -50px"></div>
|
||||
<div style="left: 75px"></div>
|
||||
<div style="left: -45px"></div>
|
||||
<div style="left: 40px"></div>
|
||||
<div style="left: -30px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for left:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-left-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 100px; width: 100px }
|
||||
div[style] { background: blue; position: relative; height: 3px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="left: calc(50px)"></div>
|
||||
<div style="left: calc(-50%)"></div>
|
||||
<div style="left: calc(25px + 50%)"></div>
|
||||
<div style="left: calc(-150% / 2 + 30px)"></div>
|
||||
<div style="left: calc(40px + 10% - 20% / 2)"></div>
|
||||
<div style="left: calc(10% - 40px)"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for right:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-left-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 100px; width: 100px }
|
||||
div[style] { background: blue; position: relative; height: 3px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="right: calc(-50px)"></div>
|
||||
<div style="right: calc(50%)"></div>
|
||||
<div style="right: calc(-25px - 50%)"></div>
|
||||
<div style="right: calc(150% / 2 - 30px)"></div>
|
||||
<div style="right: calc(-40px - 10% + 20% / 2)"></div>
|
||||
<div style="right: calc(-10% + 40px)"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for top:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 3px; }
|
||||
div[style] { background: blue; position: relative; height: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 75px"></div></div>
|
||||
<div><div style="top: 45px"></div></div>
|
||||
<div><div style="top: 40px"></div></div>
|
||||
<div><div style="top: 30px"></div></div>
|
||||
|
||||
<!-- tests with an auto-top container -->
|
||||
<div><div style="top: 50px"></div></div>
|
||||
<div><div style="top: 0px"></div></div>
|
||||
<div><div style="top: 0px"></div></div>
|
||||
<div><div style="top: 0px"></div></div>
|
||||
<div><div style="top: 0px"></div></div>
|
||||
<div><div style="top: 0px"></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for top:calc() on relatively positioned elements</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-offsets-relative-top-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
body { margin: 0 }
|
||||
body > div { float: left; height: 100px; width: 3px; }
|
||||
div[style] { background: blue; position: relative; height: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- tests with a fixed-height container -->
|
||||
<div><div style="top: calc(50px)"></div></div>
|
||||
<div><div style="top: calc(50%)"></div></div>
|
||||
<div><div style="top: calc(25px + 50%)"></div></div>
|
||||
<div><div style="top: calc(150% / 2 - 30px)"></div></div>
|
||||
<div><div style="top: calc(40px + 10% - 20% / 2)"></div></div>
|
||||
<div><div style="top: calc(40px - 10%)"></div></div>
|
||||
|
||||
<!-- tests with an auto-top container -->
|
||||
<div><div><div style="top: calc(50px)"></div></div></div>
|
||||
<div><div><div style="top: calc(50%)"></div></div></div>
|
||||
<div><div><div style="top: calc(25px + 50%)"></div></div></div>
|
||||
<div><div><div style="top: calc(150% / 2 - 30px)"></div></div></div>
|
||||
<div><div><div style="top: calc(40px + 10% - 20% / 2)"></div></div></div>
|
||||
<div><div><div style="top: calc(40px - 10%)"></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test of padding-*: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
div { border: medium solid green }
|
||||
p { background: yellow; margin: 0 }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="padding: 15px 0 0 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 15px 0 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 0 15px 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 0 0 15px"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 25px 25px 25px 25px"><p>paragraph with padding</p></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test of padding-*: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-padding-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
div { border: medium solid green }
|
||||
p { background: yellow; margin: 0 }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="padding: calc(10px + 1%) 0 0 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 calc(10px + 1%) 0 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 0 calc(10px + 1%) 0"><p>paragraph with padding</p></div>
|
||||
<div style="padding: 0 0 0 calc(10px + 1%)"><p>paragraph with padding</p></div>
|
||||
<div style="padding: calc(30px - 1%)"><p>paragraph with padding</p></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: text-indent: calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { font-size: 10px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="text-indent: 247px">50% - 3px</p>
|
||||
<p style="text-indent: 247px">25% - 3px + 25%</p>
|
||||
<p style="text-indent: 247px">25% - 3px + 12.5% * 2</p>
|
||||
<p style="text-indent: 247px">25% - 3px + 12.5%*2</p>
|
||||
<p style="text-indent: 247px">25% - 3px + 2*12.5%</p>
|
||||
<p style="text-indent: 247px">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="text-indent: 250px">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: text-indent: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-text-indent-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { font-size: 10px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="text-indent: calc(50% - 3px)">50% - 3px</p>
|
||||
<p style="text-indent: calc(25% - 3px + 25%)">25% - 3px + 25%</p>
|
||||
<p style="text-indent: calc(25% - 3px + 12.5% * 2)">25% - 3px + 12.5% * 2</p>
|
||||
<p style="text-indent: calc(25% - 3px + 12.5%*2)">25% - 3px + 12.5%*2</p>
|
||||
<p style="text-indent: calc(25% - 3px + 2*12.5%)">25% - 3px + 2*12.5%</p>
|
||||
<p style="text-indent: calc(25% - 3px + 2 * 12.5%)">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="text-indent: calc(30% + 20%)">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: intrinsic width of text-indent: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body > div { margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="width: 7px"></div>
|
||||
<div style="width: 57px"></div>
|
||||
<div style="width: 60px"></div>
|
||||
<div style="width: 10px"></div>
|
||||
<div style="width: 60px"></div>
|
||||
<div style="width: 10px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: intrinsic width of text-indent: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-text-indent-intrinsic-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { font-size: 10px }
|
||||
div { float: left; clear: left;
|
||||
margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
span { display: inline-block; width: 10px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="text-indent: calc(50% - 3px)"><span></span></div>
|
||||
<div style="text-indent: calc(5em - 3px)"><span></span></div>
|
||||
<div style="text-indent: calc(5em - 0%)"><span></span></div>
|
||||
<div style="text-indent: calc(50%)"><span></span></div>
|
||||
<div style="text-indent: calc(50px)"><span></span></div>
|
||||
<div style="text-indent: calc(25% + 25%)"><span></span></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for calc() on transform-origin</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { margin: 100px }
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
background: yellow;
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
#one { transform-origin: 150px 20px; }
|
||||
#two { transform-origin: -22px -35px; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one">hello</p>
|
||||
<p id="two">hello</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for calc() on transform-origin</title>
|
||||
<link rel="author" title="L. David Baron" href="https://bugzilla.mozilla.org/show_bug.cgi?id=594934">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-transform-origin-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { margin: 100px }
|
||||
|
||||
p {
|
||||
height: 50px; width: 200px;
|
||||
background: yellow;
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
#one { transform-origin: calc(50px + 50%) calc(100% - 30px); }
|
||||
#two { transform-origin: calc(-12.5% + 3px) calc(-10px - 50%); }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p id="one">hello</p>
|
||||
<p id="two">hello</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: Test for vertical-align:calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
|
||||
<div style="line-height: 100px; margin-top: 100px">
|
||||
<span>x</span>
|
||||
<span style="vertical-align: 50px">x</span>
|
||||
<span style="vertical-align: 50px">x</span>
|
||||
<span style="vertical-align: 75px">x</span>
|
||||
<span style="vertical-align: 45px">x</span>
|
||||
<span style="vertical-align: 40px">x</span>
|
||||
<span style="vertical-align: 30px">x</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: Test for vertical-align:calc()</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-vertical-align-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
|
||||
<div style="line-height: 100px; margin-top: 100px">
|
||||
<span>x</span>
|
||||
<span style="vertical-align: calc(50px)">x</span>
|
||||
<span style="vertical-align: calc(50%)">x</span>
|
||||
<span style="vertical-align: calc(25px + 50%)">x</span>
|
||||
<span style="vertical-align: calc(150% / 2 - 30px)">x</span>
|
||||
<span style="vertical-align: calc(40px + 10% - 20% / 2)">x</span>
|
||||
<span style="vertical-align: calc(40px - 10%)">x</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: width: calc() and min-width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { background: green; color: white; margin: 1px 0; font-size: 10px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="width: 247px">50% - 3px</p>
|
||||
<p style="width: 247px">25% - 3px + 25%</p>
|
||||
<p style="width: 247px">25% - 3px + 12.5% * 2</p>
|
||||
<p style="width: 247px">25% - 3px + 12.5%*2</p>
|
||||
<p style="width: 247px">25% - 3px + 2*12.5%</p>
|
||||
<p style="width: 247px">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="width: 250px">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-block-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { width: 500px }
|
||||
p { background: green; color: white; margin: 1px 0; font-size: 10px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p style="width: calc(50% - 3px)">50% - 3px</p>
|
||||
<p style="width: calc(25% - 3px + 25%)">25% - 3px + 25%</p>
|
||||
<p style="width: calc(25% - 3px + 12.5% * 2)">25% - 3px + 12.5% * 2</p>
|
||||
<p style="width: calc(25% - 3px + 12.5%*2)">25% - 3px + 12.5%*2</p>
|
||||
<p style="width: calc(25% - 3px + 2*12.5%)">25% - 3px + 2*12.5%</p>
|
||||
<p style="width: calc(25% - 3px + 2 * 12.5%)">25% - 3px + 2 * 12.5%</p>
|
||||
<p style="width: calc(30% + 20%)">30% + 20%</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: intrinsic width of width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body > div { margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div style="width: 200px"></div>
|
||||
<div style="width: 47px"></div>
|
||||
<div style="width: 200px"></div>
|
||||
<div style="width: 200px"></div>
|
||||
<div style="width: 50px"></div>
|
||||
<div style="width: 200px"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: intrinsic width of width: calc() on blocks</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-block-intrinsic-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
|
||||
body { font-size: 10px }
|
||||
body > div { float: left; clear: left;
|
||||
margin: 0 0 1px 0; background: blue; color: white; height: 5px }
|
||||
body > div > div > div { width: 200px }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div><div style="width: calc(50% - 3px)"><div></div></div></div>
|
||||
<div><div style="width: calc(5em - 3px)"><div></div></div></div>
|
||||
<div><div style="width: calc(5em - 0%)"><div></div></div></div>
|
||||
<div><div style="width: calc(50%)"><div></div></div></div>
|
||||
<div><div style="width: calc(50px)"><div></div></div></div>
|
||||
<div><div style="width: calc(25% + 25%)"><div></div></div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: width: calc() on table-layout: auto tables</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: 500px">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td>x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: 50%">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td>x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: width: calc() on table-layout: auto tables</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-table-auto-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(500px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(50% + 1px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(50%)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(2 * 10% + 0.5 * 500px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Reference: width: calc() on table-layout: auto tables</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
table { table-layout: fixed; width: 500px; border-spacing: 0 }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: 500px">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td>x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: 50%">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td>x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Test: width: calc() on table-layout: auto tables</title>
|
||||
<link rel="author" title="L. David Baron" href="https://dbaron.org/">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation">
|
||||
<link rel="match" href="calc-width-table-fixed-1-ref.html">
|
||||
<meta name="flags" content="">
|
||||
<style type="text/css">
|
||||
table { table-layout: fixed; width: 500px; border-spacing: 0 }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(500px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(50% + 1px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(50%)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
<table border>
|
||||
<tr>
|
||||
<td style="width: calc(2 * 10% + 0.5 * 500px)">x</td>
|
||||
<td style="width: 100px">y</td>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!doctype html>
|
||||
<title>CSS Test reference</title>
|
||||
<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
|
||||
<style>
|
||||
:root {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
div {
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<div></div>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!doctype html>
|
||||
<title>CSS Test: Test for rem units on the root element</title>
|
||||
<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-values/#rem">
|
||||
<link rel="match" href="rem-root-font-size-restyle-1-ref.html">
|
||||
<style>
|
||||
:root {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
div {
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<div></div>
|
||||
<script>
|
||||
document.documentElement.offsetTop;
|
||||
// Force a style recalc.
|
||||
document.documentElement.style.color = "green";
|
||||
</script>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 110 B |
|
|
@ -26,15 +26,11 @@ const ids = [
|
|||
"external-quoted"
|
||||
];
|
||||
|
||||
const inline_url = location.href;
|
||||
const external_url = new URL(document.querySelector("link[rel=stylesheet]").href, location.href).href;
|
||||
|
||||
for (let id of ids) {
|
||||
test(function() {
|
||||
const el = document.getElementById(id);
|
||||
const expected = id.startsWith("inline-") ? inline_url : external_url;
|
||||
const style = window.getComputedStyle(el);
|
||||
assert_equals(style["background-image"], 'url("' + expected + '")');
|
||||
assert_equals(style["background-image"], 'url("about:invalid")');
|
||||
}, "empty URL: " + id);
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue