From d65ac86a1d8b9914b14b57dc2e6959e3690e7d80 Mon Sep 17 00:00:00 2001
From: "dbaron%dbaron.org" <dbaron%dbaron.org>
Date: Thu, 22 Mar 2007 04:37:21 +0000
Subject: [PATCH] Add pixel rounding reftests for rounded backgrounds
 (currently broken due to at least bug 353860), initially marked as random so
 I can see how we're doing before marking.

---
 layout/reftests/pixel-rounding/reftest.list   | 31 ++++++++
 .../rounded-background-color-base-ref.html    | 74 +++++++++++++++++++
 ...ounded-background-color-height-10-ref.html | 74 +++++++++++++++++++
 .../rounded-background-color-height-4.html    | 74 +++++++++++++++++++
 .../rounded-background-color-height-5.html    | 74 +++++++++++++++++++
 .../rounded-background-color-height-6.html    | 74 +++++++++++++++++++
 ...rounded-background-color-height-top-4.html | 74 +++++++++++++++++++
 ...rounded-background-color-height-top-5.html | 74 +++++++++++++++++++
 ...rounded-background-color-height-top-6.html | 74 +++++++++++++++++++
 .../rounded-background-color-left-10-ref.html | 74 +++++++++++++++++++
 .../rounded-background-color-left-4.html      | 74 +++++++++++++++++++
 .../rounded-background-color-left-5.html      | 74 +++++++++++++++++++
 .../rounded-background-color-left-6.html      | 74 +++++++++++++++++++
 ...rounded-background-color-left-width-4.html | 74 +++++++++++++++++++
 ...rounded-background-color-left-width-5.html | 74 +++++++++++++++++++
 ...rounded-background-color-left-width-6.html | 74 +++++++++++++++++++
 .../rounded-background-color-top-10-ref.html  | 74 +++++++++++++++++++
 .../rounded-background-color-top-4.html       | 74 +++++++++++++++++++
 .../rounded-background-color-top-5.html       | 74 +++++++++++++++++++
 .../rounded-background-color-top-6.html       | 74 +++++++++++++++++++
 ...rounded-background-color-top-height-4.html | 74 +++++++++++++++++++
 ...rounded-background-color-top-height-5.html | 74 +++++++++++++++++++
 ...rounded-background-color-top-height-6.html | 74 +++++++++++++++++++
 ...rounded-background-color-width-10-ref.html | 74 +++++++++++++++++++
 .../rounded-background-color-width-4.html     | 74 +++++++++++++++++++
 .../rounded-background-color-width-5.html     | 74 +++++++++++++++++++
 .../rounded-background-color-width-6.html     | 74 +++++++++++++++++++
 ...rounded-background-color-width-left-4.html | 74 +++++++++++++++++++
 ...rounded-background-color-width-left-5.html | 74 +++++++++++++++++++
 ...rounded-background-color-width-left-6.html | 74 +++++++++++++++++++
 30 files changed, 2177 insertions(+)
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-base-ref.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-10-ref.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-top-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-top-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-height-top-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-10-ref.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-width-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-width-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-left-width-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-10-ref.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-height-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-height-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-top-height-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-10-ref.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-6.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-left-4.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-left-5.html
 create mode 100644 layout/reftests/pixel-rounding/rounded-background-color-width-left-6.html

diff --git a/layout/reftests/pixel-rounding/reftest.list b/layout/reftests/pixel-rounding/reftest.list
index d6effa816b9..4e982ba2cb9 100644
--- a/layout/reftests/pixel-rounding/reftest.list
+++ b/layout/reftests/pixel-rounding/reftest.list
@@ -142,3 +142,34 @@ fails-if(MOZ_WIDGET_TOOLKIT!="cocoa") == offscreen-image-pos-5.html offscreen-10
 random == offscreen-image-size-4.html offscreen-0-ref.html # bug 371316
 random == offscreen-image-size-5.html offscreen-10-ref.html # bug 371316
 random == offscreen-image-size-6.html offscreen-10-ref.html # bug 371316
+
+
+# Many of these should fail due to bug 353860.
+random != rounded-background-color-base.html rounded-background-color-height-10-ref.html
+random == rounded-background-color-height-4.html rounded-background-color-base.html
+random == rounded-background-color-height-5.html rounded-background-color-height-10-ref.html
+random == rounded-background-color-height-6.html rounded-background-color-height-10-ref.html
+random != rounded-background-color-base.html rounded-background-color-top-10-ref.html
+random == rounded-background-color-top-4.html rounded-background-color-base.html
+random == rounded-background-color-top-5.html rounded-background-color-top-10-ref.html
+random == rounded-background-color-top-6.html rounded-background-color-top-10-ref.html
+random != rounded-background-color-base.html rounded-background-color-width-10-ref.html
+random == rounded-background-color-width-4.html rounded-background-color-base.html
+random == rounded-background-color-width-5.html rounded-background-color-width-10-ref.html
+random == rounded-background-color-width-6.html rounded-background-color-width-10-ref.html
+random != rounded-background-color-base.html rounded-background-color-left-10-ref.html
+random == rounded-background-color-left-4.html rounded-background-color-base.html
+random == rounded-background-color-left-5.html rounded-background-color-left-10-ref.html
+random == rounded-background-color-left-6.html rounded-background-color-left-10-ref.html
+random == rounded-background-color-top-height-4.html rounded-background-color-height-4.html
+random == rounded-background-color-top-height-5.html rounded-background-color-height-5.html
+random == rounded-background-color-top-height-6.html rounded-background-color-height-6.html
+random == rounded-background-color-left-width-4.html rounded-background-color-width-4.html
+random == rounded-background-color-left-width-5.html rounded-background-color-width-5.html
+random == rounded-background-color-left-width-6.html rounded-background-color-width-6.html
+random == rounded-background-color-height-top-4.html rounded-background-color-height-4.html
+random == rounded-background-color-height-top-5.html rounded-background-color-height-5.html
+random == rounded-background-color-height-top-6.html rounded-background-color-height-6.html
+random == rounded-background-color-width-left-4.html rounded-background-color-width-4.html
+random == rounded-background-color-width-left-5.html rounded-background-color-width-5.html
+random == rounded-background-color-width-left-6.html rounded-background-color-width-6.html
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-base-ref.html b/layout/reftests/pixel-rounding/rounded-background-color-base-ref.html
new file mode 100644
index 00000000000..8a7defb882e
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-base-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-10-ref.html b/layout/reftests/pixel-rounding/rounded-background-color-height-10-ref.html
new file mode 100644
index 00000000000..4eb9d3b780d
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-10-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 11px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-4.html b/layout/reftests/pixel-rounding/rounded-background-color-height-4.html
new file mode 100644
index 00000000000..921c4ea3a3c
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10.4px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-5.html b/layout/reftests/pixel-rounding/rounded-background-color-height-5.html
new file mode 100644
index 00000000000..bf712bf170b
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10.5px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-6.html b/layout/reftests/pixel-rounding/rounded-background-color-height-6.html
new file mode 100644
index 00000000000..e715d08eefb
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10.6px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-top-4.html b/layout/reftests/pixel-rounding/rounded-background-color-height-top-4.html
new file mode 100644
index 00000000000..e9a4b8f43cf
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-top-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: -0.1px; left: 0; height: 10.5px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 19.9px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-top-5.html b/layout/reftests/pixel-rounding/rounded-background-color-height-top-5.html
new file mode 100644
index 00000000000..874544d0837
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-top-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0px; left: 0; height: 10.5px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-height-top-6.html b/layout/reftests/pixel-rounding/rounded-background-color-height-top-6.html
new file mode 100644
index 00000000000..2f04f2e3340
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-height-top-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0.1px; left: 0; height: 10.5px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20.1px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-10-ref.html b/layout/reftests/pixel-rounding/rounded-background-color-left-10-ref.html
new file mode 100644
index 00000000000..b76585a0c74
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-10-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 1px; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 21px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-4.html b/layout/reftests/pixel-rounding/rounded-background-color-left-4.html
new file mode 100644
index 00000000000..3952396f41c
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0.4px; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20.4px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-5.html b/layout/reftests/pixel-rounding/rounded-background-color-left-5.html
new file mode 100644
index 00000000000..6924d39c535
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0.5px; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20.5px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-6.html b/layout/reftests/pixel-rounding/rounded-background-color-left-6.html
new file mode 100644
index 00000000000..fbc24f7ec60
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0.6px; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20.6px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-width-4.html b/layout/reftests/pixel-rounding/rounded-background-color-left-width-4.html
new file mode 100644
index 00000000000..991b69258ee
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-width-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: -0.5px; height: 10px; width: 10.9px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 19.5px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-width-5.html b/layout/reftests/pixel-rounding/rounded-background-color-left-width-5.html
new file mode 100644
index 00000000000..3bedaaa463c
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-width-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: -0.5px; height: 10px; width: 11px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 19.5px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-left-width-6.html b/layout/reftests/pixel-rounding/rounded-background-color-left-width-6.html
new file mode 100644
index 00000000000..f502546a000
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-left-width-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: -0.5px; height: 10px; width: 11.1px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 19.5px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-10-ref.html b/layout/reftests/pixel-rounding/rounded-background-color-top-10-ref.html
new file mode 100644
index 00000000000..fc918b03379
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-10-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 1px; left: 0; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 21px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-4.html b/layout/reftests/pixel-rounding/rounded-background-color-top-4.html
new file mode 100644
index 00000000000..13fe0d4c4d2
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0.4px; left: 0; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20.4px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-5.html b/layout/reftests/pixel-rounding/rounded-background-color-top-5.html
new file mode 100644
index 00000000000..e67ac10faf8
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0.5px; left: 0; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20.5px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-6.html b/layout/reftests/pixel-rounding/rounded-background-color-top-6.html
new file mode 100644
index 00000000000..4c29f4225e5
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0.6px; left: 0; height: 10px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20.6px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-height-4.html b/layout/reftests/pixel-rounding/rounded-background-color-top-height-4.html
new file mode 100644
index 00000000000..a7dd148b209
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-height-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: -0.5px; left: 0; height: 10.9px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 19.5px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-height-5.html b/layout/reftests/pixel-rounding/rounded-background-color-top-height-5.html
new file mode 100644
index 00000000000..5f8ce6915e1
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-height-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: -0.5px; left: 0; height: 11px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 19.5px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-top-height-6.html b/layout/reftests/pixel-rounding/rounded-background-color-top-height-6.html
new file mode 100644
index 00000000000..c64f79dc4b0
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-top-height-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: -0.5px; left: 0; height: 11.1px; width: 10px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 19.5px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-10-ref.html b/layout/reftests/pixel-rounding/rounded-background-color-width-10-ref.html
new file mode 100644
index 00000000000..40f8393c546
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-10-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10px; width: 11px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-4.html b/layout/reftests/pixel-rounding/rounded-background-color-width-4.html
new file mode 100644
index 00000000000..ee82494f6a7
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10px; width: 10.4px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-5.html b/layout/reftests/pixel-rounding/rounded-background-color-width-5.html
new file mode 100644
index 00000000000..09a7c7eb58b
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10px; width: 10.5px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-6.html b/layout/reftests/pixel-rounding/rounded-background-color-width-6.html
new file mode 100644
index 00000000000..16a20411cd0
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0; height: 10px; width: 10.6px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-left-4.html b/layout/reftests/pixel-rounding/rounded-background-color-width-left-4.html
new file mode 100644
index 00000000000..5a6e1b2a7f2
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-left-4.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: -0.1px; height: 10px; width: 10.5px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 19.9px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-left-5.html b/layout/reftests/pixel-rounding/rounded-background-color-width-left-5.html
new file mode 100644
index 00000000000..fce438bd156
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-left-5.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0px; height: 10px; width: 10.5px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/pixel-rounding/rounded-background-color-width-left-6.html b/layout/reftests/pixel-rounding/rounded-background-color-width-left-6.html
new file mode 100644
index 00000000000..75a36be4878
--- /dev/null
+++ b/layout/reftests/pixel-rounding/rounded-background-color-width-left-6.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>Pixel rounding testcase</title>
+<style type="text/css">
+
+html, body { margin: 0; border: none; padding: 0; }
+
+body > div { margin: 10px; height: 80px; position: relative; }
+
+body > div > div {
+    position: absolute; top: 0; left: 0.1px; height: 10px; width: 10.5px;
+}
+
+body > div > div { background: green; }
+
+.tl { top: 20px; }
+.tr { margin-top: 40px; }
+.bl { left: 20.1px; }
+.br { margin-left: 40px; }
+
+div.one > div.tl { -moz-border-radius-topleft: 1px; }
+div.one > div.tr { -moz-border-radius-topright: 1px; }
+div.one > div.bl { -moz-border-radius-bottomleft: 1px; }
+div.one > div.br { -moz-border-radius-bottomright: 1px; }
+div.four > div.tl { -moz-border-radius-topleft: 4px; }
+div.four > div.tr { -moz-border-radius-topright: 4px; }
+div.four > div.bl { -moz-border-radius-bottomleft: 4px; }
+div.four > div.br { -moz-border-radius-bottomright: 4px; }
+
+</style>
+</head>
+<body>
+
+<div class="one">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+<div class="four">
+<div></div>
+<div class="tl"></div>
+<div class="tr"></div>
+<div class="bl"></div>
+<div class="br"></div>
+<div class="tl tr"></div>
+<div class="tl bl"></div>
+<div class="tl br"></div>
+<div class="tr bl"></div>
+<div class="tr br"></div>
+<div class="bl br"></div>
+<div class="tl tr bl"></div>
+<div class="tl tr br"></div>
+<div class="tl bl br"></div>
+<div class="tr bl br"></div>
+<div class="tl tr bl br"></div>
+</div>
+
+</body>
+</html>