1 files changed, 62 insertions, 0 deletions
diff --git a/layout/reftests/forms/button/focus-area-percent-units-1.html b/layout/reftests/forms/button/focus-area-percent-units-1.html
new file mode 100644
index 000000000..17d65b3b0
--- /dev/null
+++ b/layout/reftests/forms/button/focus-area-percent-units-1.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<!-- Any copyright is dedicated to the Public Domain.
+   - http://creativecommons.org/publicdomain/zero/1.0/ -->
+<html>
+<!-- The ::-moz-focus-inner & ::-moz-focus-outer button pseudo-elements only
+     support CSS "margin" values that contain absolute lengths.  Any percent or
+     "auto" margin values will simply make the margin collapse to zero.
+     This test verifies that this is indeed what happens (not anything worse).
+-->
+<head>
+  <title>Testcase for bug 1272983</title>
+  <style>
+    /* Set explicit font size so that em units are predictable: */
+    body, button { font: 10px sans-serif; }
+
+    /* Testing percent and auto margin values on "-moz-focus-inner": */
+    button.mfi1::-moz-focus-inner { margin: 50%; }
+    button.mfi2::-moz-focus-inner { margin: 50% 10px; }
+    button.mfi3::-moz-focus-inner { margin: 10px 50%; }
+    button.mfi4::-moz-focus-inner { margin: auto; }
+    button.mfi5::-moz-focus-inner { margin: auto 10px; }
+    button.mfi6::-moz-focus-inner { margin: 10px auto; }
+    button.mfi7::-moz-focus-inner { margin: 10px; }
+    button.mfi8::-moz-focus-inner { margin: 2em; }
+
+    /* Testing percent and auto margin values on "-moz-focus-outer":
+       (just for completeness -- really, 'margin' has no effect on
+       the behavior of -moz-focus-outer) */
+    button.mfo1::-moz-focus-outer { margin: 50%; }
+    button.mfo2::-moz-focus-outer { margin: 50% 10px; }
+    button.mfo3::-moz-focus-outer { margin: 10px 50%; }
+    button.mfo4::-moz-focus-outer { margin: auto; }
+    button.mfo5::-moz-focus-outer { margin: auto 10px; }
+    button.mfo6::-moz-focus-outer { margin: 10px auto; }
+    button.mfo7::-moz-focus-outer { margin: 10px; }
+    button.mfo8::-moz-focus-outer { margin: 2em; }
+  </style>
+</head>
+<body>
+  <button class="mfi1">mfi1</button>
+  <button class="mfi2">mfi2</button>
+  <button class="mfi3">mfi3</button>
+  <button class="mfi4">mfi4</button>
+  <br>
+  <button class="mfi5">mfi5</button>
+  <button class="mfi6">mfi6</button>
+  <button class="mfi7">mfi7</button>
+  <button class="mfi8">mfi8</button>
+  <br>
+
+  <button class="mfo1">mfo1</button>
+  <button class="mfo2">mfo2</button>
+  <button class="mfo3">mfo3</button>
+  <button class="mfo4">mfo4</button>
+  <br>
+  <button class="mfo5">mfo5</button>
+  <button class="mfo6">mfo6</button>
+  <button class="mfo7">mfo7</button>
+  <button class="mfo8">mfo8</button>
+  <br>
+</body>
+</html>