Add m-esr52 at 52.6.0

author: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
committer: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
commit: 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree: 10027f336435511475e392454359edea8e25895d /layout/reftests/w3c-css/submitted/values3
parent: 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download: UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
56 files changed, 1526 insertions, 0 deletions
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1-ref.html
new file mode 100644
index 000000000..3fefef23f
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1-ref.html
@@ -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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1.html b/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1.html
new file mode 100644
index 000000000..b2c028974
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-image-gradient-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1-ref.html
new file mode 100644
index 000000000..5c8a60412
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1.html b/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1.html
new file mode 100644
index 000000000..6d60e8dd9
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-linear-gradient-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-position-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-background-position-1-ref.html
new file mode 100644
index 000000000..a9d8056cc
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-position-1-ref.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(../backgrounds/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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-position-1.html b/layout/reftests/w3c-css/submitted/values3/calc-background-position-1.html
new file mode 100644
index 000000000..2a8bfdf65
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-position-1.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(../backgrounds/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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-size-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-background-size-1-ref.html
new file mode 100644
index 000000000..16b89c1d8
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-size-1-ref.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(../backgrounds/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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-background-size-1.html b/layout/reftests/w3c-css/submitted/values3/calc-background-size-1.html
new file mode 100644
index 000000000..e91f8c26c
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-background-size-1.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(../backgrounds/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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1-ref.html
new file mode 100644
index 000000000..24681d08a
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1.html b/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1.html
new file mode 100644
index 000000000..ad36d3649
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-border-radius-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-height-block-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-height-block-1-ref.html
new file mode 100644
index 000000000..be75d5d6a
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-height-block-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-height-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-height-block-1.html
new file mode 100644
index 000000000..9525c87de
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-height-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-height-table-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-height-table-1-ref.html
new file mode 100644
index 000000000..d936f69ed
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-height-table-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-height-table-1.html b/layout/reftests/w3c-css/submitted/values3/calc-height-table-1.html
new file mode 100644
index 000000000..64b7b5dc3
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-height-table-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1-ref.html
new file mode 100644
index 000000000..acfc08892
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1.html
new file mode 100644
index 000000000..7372bd2ae
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-margin-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1-ref.html
new file mode 100644
index 000000000..9907c9984
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1.html
new file mode 100644
index 000000000..d0f978a2b
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-max-height-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-1.html
new file mode 100644
index 000000000..c6a31d229
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1-ref.html
new file mode 100644
index 000000000..8cb693160
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1.html b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1.html
new file mode 100644
index 000000000..433c1950c
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-max-width-block-intrinsic-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-min-height-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-min-height-block-1.html
new file mode 100644
index 000000000..ed60d9a03
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-min-height-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-1.html
new file mode 100644
index 000000000..8195f6859
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1-ref.html
new file mode 100644
index 000000000..82fae9717
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1.html b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1.html
new file mode 100644
index 000000000..edc564331
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-min-width-block-intrinsic-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-bottom-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-bottom-1.html
new file mode 100644
index 000000000..b3bf1ccb7
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-bottom-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-left-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-left-1.html
new file mode 100644
index 000000000..8ee19c7a5
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-left-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-right-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-right-1.html
new file mode 100644
index 000000000..3fcdba055
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-right-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1-ref.html
new file mode 100644
index 000000000..5c6c06364
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1.html
new file mode 100644
index 000000000..7ac2dfe2a
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-absolute-top-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-bottom-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-bottom-1.html
new file mode 100644
index 000000000..1f121ac54
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-bottom-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1-ref.html
new file mode 100644
index 000000000..82ab51df0
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1.html
new file mode 100644
index 000000000..b091ca550
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-left-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-right-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-right-1.html
new file mode 100644
index 000000000..28e154777
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-right-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1-ref.html
new file mode 100644
index 000000000..db6785b29
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1.html b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1.html
new file mode 100644
index 000000000..f2e9e4d9b
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-offsets-relative-top-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1-ref.html
new file mode 100644
index 000000000..ca472b38e
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1.html
new file mode 100644
index 000000000..97dbaeb2f
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-padding-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1-ref.html
new file mode 100644
index 000000000..4631c0021
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1.html b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1.html
new file mode 100644
index 000000000..dec795b2d
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1-ref.html
new file mode 100644
index 000000000..93c8c8997
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1-ref.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: 10px"></div>
+<div style="width: 57px"></div>
+<div style="width: 10px"></div>
+<div style="width: 10px"></div>
+<div style="width: 60px"></div>
+<div style="width: 10px"></div>
+</body>
+</html>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1.html b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1.html
new file mode 100644
index 000000000..b60a7e949
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-text-indent-intrinsic-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1-ref.html
new file mode 100644
index 000000000..d27da3efe
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1.html b/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1.html
new file mode 100644
index 000000000..bbe70749d
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-transform-origin-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1-ref.html
new file mode 100644
index 000000000..8e6d42425
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1.html b/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1.html
new file mode 100644
index 000000000..f612b962e
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-vertical-align-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-block-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-width-block-1-ref.html
new file mode 100644
index 000000000..d62da1ad3
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-block-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-block-1.html b/layout/reftests/w3c-css/submitted/values3/calc-width-block-1.html
new file mode 100644
index 000000000..d261d0398
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-block-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1-ref.html
new file mode 100644
index 000000000..e381bbab5
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1-ref.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1.html b/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1.html
new file mode 100644
index 000000000..0c80b960d
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-block-intrinsic-1.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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1-ref.html
new file mode 100644
index 000000000..62ebd5665
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1-ref.html
@@ -0,0 +1,23 @@
+<!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>x</td>
+    <td style="width: 100px">y</td>
+</table>
+</body>
+</html>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1.html b/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1.html
new file mode 100644
index 000000000..b37c94ec5
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-table-auto-1.html
@@ -0,0 +1,25 @@
+<!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%)">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>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1-ref.html b/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1-ref.html
new file mode 100644
index 000000000..1aad9eb16
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1-ref.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="">
+<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>x</td>
+    <td style="width: 100px">y</td>
+</table>
+</body>
+</html>
diff --git a/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1.html b/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1.html
new file mode 100644
index 000000000..05a902217
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/calc-width-table-fixed-1.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-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%)">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>
diff --git a/layout/reftests/w3c-css/submitted/values3/reftest-stylo.list b/layout/reftests/w3c-css/submitted/values3/reftest-stylo.list
new file mode 100644
index 000000000..9535b43e9
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/reftest-stylo.list
@@ -0,0 +1,33 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+== calc-background-linear-gradient-1.html calc-background-linear-gradient-1.html
+== calc-background-image-gradient-1.html calc-background-image-gradient-1.html
+== calc-background-position-1.html calc-background-position-1.html
+== calc-background-size-1.html calc-background-size-1.html
+== calc-border-radius-1.html calc-border-radius-1.html
+== calc-height-block-1.html calc-height-block-1.html
+skip-if(B2G||Mulet) == calc-height-table-1.html calc-height-table-1.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+== calc-margin-block-1.html calc-margin-block-1.html
+== calc-max-height-block-1.html calc-max-height-block-1.html
+== calc-max-width-block-1.html calc-max-width-block-1.html
+== calc-max-width-block-intrinsic-1.html calc-max-width-block-intrinsic-1.html
+== calc-min-height-block-1.html calc-min-height-block-1.html
+== calc-min-width-block-1.html calc-min-width-block-1.html
+== calc-min-width-block-intrinsic-1.html calc-min-width-block-intrinsic-1.html
+== calc-offsets-absolute-bottom-1.html calc-offsets-absolute-bottom-1.html
+== calc-offsets-absolute-left-1.html calc-offsets-absolute-left-1.html
+== calc-offsets-absolute-right-1.html calc-offsets-absolute-right-1.html
+== calc-offsets-absolute-top-1.html calc-offsets-absolute-top-1.html
+== calc-offsets-relative-bottom-1.html calc-offsets-relative-bottom-1.html
+== calc-offsets-relative-left-1.html calc-offsets-relative-left-1.html
+== calc-offsets-relative-right-1.html calc-offsets-relative-right-1.html
+== calc-offsets-relative-top-1.html calc-offsets-relative-top-1.html
+== calc-padding-block-1.html calc-padding-block-1.html
+== calc-text-indent-1.html calc-text-indent-1.html
+== calc-text-indent-intrinsic-1.html calc-text-indent-intrinsic-1.html
+fuzzy-if(skiaContent,1,11) == calc-transform-origin-1.html calc-transform-origin-1.html
+== calc-vertical-align-1.html calc-vertical-align-1.html
+== calc-width-block-1.html calc-width-block-1.html
+== calc-width-block-intrinsic-1.html calc-width-block-intrinsic-1.html
+== calc-width-table-auto-1.html calc-width-table-auto-1.html
+== calc-width-table-fixed-1.html calc-width-table-fixed-1.html
diff --git a/layout/reftests/w3c-css/submitted/values3/reftest.list b/layout/reftests/w3c-css/submitted/values3/reftest.list
new file mode 100644
index 000000000..fb9fa6f27
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/values3/reftest.list
@@ -0,0 +1,31 @@
+== calc-background-linear-gradient-1.html calc-background-linear-gradient-1-ref.html
+== calc-background-image-gradient-1.html calc-background-image-gradient-1-ref.html
+== calc-background-position-1.html calc-background-position-1-ref.html
+== calc-background-size-1.html calc-background-size-1-ref.html
+== calc-border-radius-1.html calc-border-radius-1-ref.html
+== calc-height-block-1.html calc-height-block-1-ref.html
+== calc-height-table-1.html calc-height-table-1-ref.html
+== calc-margin-block-1.html calc-margin-block-1-ref.html
+== calc-max-height-block-1.html calc-max-height-block-1-ref.html
+== calc-max-width-block-1.html calc-width-block-1-ref.html
+== calc-max-width-block-intrinsic-1.html calc-max-width-block-intrinsic-1-ref.html
+== calc-min-height-block-1.html calc-height-block-1-ref.html
+== calc-min-width-block-1.html calc-width-block-1-ref.html
+== calc-min-width-block-intrinsic-1.html calc-min-width-block-intrinsic-1-ref.html
+== calc-offsets-absolute-bottom-1.html calc-offsets-absolute-top-1-ref.html
+== calc-offsets-absolute-left-1.html calc-offsets-relative-left-1-ref.html
+== calc-offsets-absolute-right-1.html calc-offsets-relative-left-1-ref.html
+== calc-offsets-absolute-top-1.html calc-offsets-absolute-top-1-ref.html
+== calc-offsets-relative-bottom-1.html calc-offsets-relative-top-1-ref.html
+== calc-offsets-relative-left-1.html calc-offsets-relative-left-1-ref.html
+== calc-offsets-relative-right-1.html calc-offsets-relative-left-1-ref.html
+== calc-offsets-relative-top-1.html calc-offsets-relative-top-1-ref.html
+== calc-padding-block-1.html calc-padding-block-1-ref.html
+== calc-text-indent-1.html calc-text-indent-1-ref.html
+== calc-text-indent-intrinsic-1.html calc-text-indent-intrinsic-1-ref.html
+fuzzy-if(skiaContent,1,11) == calc-transform-origin-1.html calc-transform-origin-1-ref.html
+== calc-vertical-align-1.html calc-vertical-align-1-ref.html
+== calc-width-block-1.html calc-width-block-1-ref.html
+== calc-width-block-intrinsic-1.html calc-width-block-intrinsic-1-ref.html
+== calc-width-table-auto-1.html calc-width-table-auto-1-ref.html
+== calc-width-table-fixed-1.html calc-width-table-fixed-1-ref.html
author	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
committer	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
commit	5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree	10027f336435511475e392454359edea8e25895d /layout/reftests/w3c-css/submitted/values3
parent	49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download	UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip