summaryrefslogtreecommitdiffstats
path: root/layout/reftests/css-break
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /layout/reftests/css-break
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'layout/reftests/css-break')
-rw-r--r--layout/reftests/css-break/box-decoration-break-1-ref.html67
-rw-r--r--layout/reftests/css-break/box-decoration-break-1.html71
-rw-r--r--layout/reftests/css-break/box-decoration-break-block-border-padding-ref.html50
-rw-r--r--layout/reftests/css-break/box-decoration-break-block-border-padding.html50
-rw-r--r--layout/reftests/css-break/box-decoration-break-block-margin-ref.html67
-rw-r--r--layout/reftests/css-break/box-decoration-break-block-margin.html65
-rw-r--r--layout/reftests/css-break/box-decoration-break-border-image-ref.html138
-rw-r--r--layout/reftests/css-break/box-decoration-break-border-image.html84
-rw-r--r--layout/reftests/css-break/box-decoration-break-bug-1235152-ref.html57
-rw-r--r--layout/reftests/css-break/box-decoration-break-bug-1235152.html61
-rw-r--r--layout/reftests/css-break/box-decoration-break-bug-1249913-ref.html55
-rw-r--r--layout/reftests/css-break/box-decoration-break-bug-1249913.html55
-rw-r--r--layout/reftests/css-break/box-decoration-break-first-letter-ref.html70
-rw-r--r--layout/reftests/css-break/box-decoration-break-first-letter.html72
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-bidi-ref.html74
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-bidi.html64
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1-ref.html132
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1.html134
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1-ref.html131
-rw-r--r--layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1.html133
-rw-r--r--layout/reftests/css-break/green-circle-alpha-32x32.pngbin0 -> 396 bytes
-rw-r--r--layout/reftests/css-break/reftest-stylo.list13
-rw-r--r--layout/reftests/css-break/reftest.list12
23 files changed, 1655 insertions, 0 deletions
diff --git a/layout/reftests/css-break/box-decoration-break-1-ref.html b/layout/reftests/css-break/box-decoration-break-1-ref.html
new file mode 100644
index 000000000..431c499a1
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-1-ref.html
@@ -0,0 +1,67 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <meta charset="utf-8">
+<style>
+
+span {
+ line-height:4em;
+ font-family:monospace;
+ padding: 3px 5px 7px 11px;
+ background-color: #0F0;
+ margin: 13px 17px 19px 23px;
+ border-left:13px dashed pink;
+ border-top:7px dashed blue;
+ border-right:3px dashed black;
+ border-bottom:1px dashed blue;
+}
+.o0 {
+ border-radius: 17px;
+}
+.o10 {
+ border-radius: 17px;
+ margin-left:0;
+}
+.o10x {
+ border-radius: 17px;
+ padding-right:0;
+}
+.so0 {
+ border-radius: 0px;
+}
+.so10 {
+ border-radius: 0px;
+ margin-right:0;
+}
+.so10x {
+ border-radius: 0px;
+ padding-left:0;
+}
+</style>
+</head>
+<body style="margin:10px">
+
+<table border=1 cellpadding=10><tr>
+<td><span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+</tr>
+</table>
+
+<br>
+
+<table border=1 cellpadding=10><tr>
+<td><span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+</tr>
+</table>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-1.html b/layout/reftests/css-break/box-decoration-break-1.html
new file mode 100644
index 000000000..e0326ccc1
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-1.html
@@ -0,0 +1,71 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-1-ref.html">
+ <meta charset="utf-8">
+<style>
+
+span {
+ box-decoration-break:clone;
+
+ line-height:4em;
+ font-family:monospace;
+ padding: 3px 5px 7px 11px;
+ background-color: #0F0;
+ margin: 13px 17px 19px 23px;
+ border-left:13px dashed pink;
+ border-top:7px dashed blue;
+ border-right:3px dashed black;
+ border-bottom:1px dashed blue;
+}
+.o0 {
+ border-radius: 17px;
+}
+.o10 {
+ border-radius: 17px;
+ margin-left:0;
+}
+.o10x {
+ border-radius: 17px;
+ padding-right:0;
+}
+.so0 {
+ border-radius: 0px;
+}
+.so10 {
+ border-radius: 0px;
+ margin-right:0;
+}
+.so10x {
+ border-radius: 0px;
+ padding-left:0;
+}
+</style>
+</head>
+<body style="margin:10px">
+
+<table border=1 cellpadding=10><tr>
+<td><span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+<td><span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
+</tr>
+</table>
+
+<br>
+
+<table border=1 cellpadding=10><tr>
+<td><span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
+<td><span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
+<td><span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
+</tr>
+</table>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-block-border-padding-ref.html b/layout/reftests/css-break/box-decoration-break-block-border-padding-ref.html
new file mode 100644
index 000000000..f046252aa
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-block-border-padding-ref.html
@@ -0,0 +1,50 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for box-decoration-break:clone, block border+padding</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=988653">
+ <meta charset="utf-8">
+ <style type="text/css">
+ html,body {
+ color:black; background-color:white; font-size:16px; padding:10px; margin:0;
+ }
+
+ .inner {
+ border: 5px dashed blue;
+ height: 33px;
+ width: 40px;
+ background: lime;
+ background-clip: content-box;
+ margin-bottom: 12px;
+ }
+
+ .columns {
+ -moz-columns: 3;
+ width: 250px;
+ height: 50px;
+ background: grey;
+ margin-top: 2px;
+ }
+
+ .unbalanced {
+ -moz-column-fill: auto;
+ }
+
+ .inner.p { height:31px; padding:1px 3px 5px 7px; }
+ .unbalanced .inner { height:40px; margin-bottom: 0px;}
+ .unbalanced .inner.p { height:34px; }
+ </style>
+</head>
+<body>
+
+<div class="columns"><div class="inner"></div><div class="inner"></div><div class="inner"></div></div>
+<div class="columns unbalanced"><div class="inner"></div><div class="inner"></div><div class="inner" style="height:19px"></div></div>
+<div class="columns"><div class="p inner"></div><div class="p inner"></div><div class="p inner"></div></div>
+<div class="columns unbalanced"><div class="p inner"></div><div class="p inner"></div><div class="p inner" style="height:25px"></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-block-border-padding.html b/layout/reftests/css-break/box-decoration-break-block-border-padding.html
new file mode 100644
index 000000000..bb5a17663
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-block-border-padding.html
@@ -0,0 +1,50 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for box-decoration-break:clone, block border+padding</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=988653">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-block-border-padding-ref.html">
+ <meta charset="utf-8">
+ <style type="text/css">
+ html,body {
+ color:black; background-color:white; font-size:16px; padding:10px; margin:0;
+ }
+
+ .inner {
+ box-decoration-break: clone;
+ border: 5px dashed blue;
+ height: 99px;
+ width: 40px;
+ background: lime;
+ background-clip: content-box;
+ }
+
+ .columns {
+ -moz-columns: 3;
+ width: 250px;
+ height: 50px;
+ background: grey;
+ margin-top: 2px;
+ }
+
+ .unbalanced {
+ -moz-column-fill: auto;
+ }
+
+ .inner.p { height:93px; padding:1px 3px 5px 7px; }
+ </style>
+</head>
+<body>
+
+<div class="columns"><div class="inner"></div></div>
+<div class="columns unbalanced"><div class="inner"></div></div>
+<div class="columns"><div class="p inner"></div></div>
+<div class="columns unbalanced"><div class="p inner"></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-block-margin-ref.html b/layout/reftests/css-break/box-decoration-break-block-margin-ref.html
new file mode 100644
index 000000000..53cf02ad7
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-block-margin-ref.html
@@ -0,0 +1,67 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for box-decoration-break:clone, block margin</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1025669">
+ <meta charset="utf-8">
+ <style type="text/css">
+ html,body {
+ color:black; background-color:white; font-size:16px; padding:10px; margin:0;
+ }
+
+ .inner {
+ border: 5px dashed blue;
+ height: 26px;
+ width: 40px;
+ background: lime;
+ background-clip: padding-box;
+ margin: 0px 3px 15px 1px;
+ position: relative;
+ top: 7px;
+ }
+
+ .columns {
+ -moz-columns: 3;
+ width: 250px;
+ height: 50px;
+ background: grey;
+ }
+
+ .outer {
+ margin-top: 2px;
+ height: 50px;
+ width: 250px;
+ background: grey;
+ }
+
+ .unbalanced {
+ -moz-column-fill: auto;
+ }
+
+ .unbalanced .inner { height: 28px; }
+ .x .inner { height: 28px; }
+ .x.unbalanced .inner { height: 28px; }
+
+ #t2 .inner { border-style:none; height: 38px; }
+ </style>
+</head>
+<body>
+
+<div class="outer"><div class="columns"><div class="inner"></div><div class="inner"></div><div class="inner"></div></div></div>
+<div class="outer"><div class="columns unbalanced"><div class="inner"></div><div class="inner"></div><div class="inner" style="height:22px"></div></div></div>
+<div class="outer"><div class="columns x"><div class="p inner"></div><div class="inner"></div><div class="inner" style="height:31px"></div></div></div>
+<div class="outer"><div class="columns x unbalanced"><div class="p inner"></div><div class="inner"></div><div class="inner"></div></div></div>
+
+<div id="t2">
+<div class="outer"><div class="columns unbalanced"><div class="inner"></div><div class="inner"></div><div class="inner" style="height:2px"></div></div></div>
+<div class="outer"><div class="columns unbalanced"><div style="height:4px"></div><div class="inner" style="height:34px"></div><div class="inner"></div><div class="inner" style="height:6px"></div></div></div>
+<div class="outer"><div class="columns unbalanced x"><div class="p inner"></div><div class="inner"></div><div class="inner" style="height:2px"></div></div></div>
+<div class="outer"><div class="columns unbalanced"><div style="height:4px"></div><div class="inner" style="height:34px"></div><div class="inner"></div><div class="inner" style="height:6px"></div></div></div>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-block-margin.html b/layout/reftests/css-break/box-decoration-break-block-margin.html
new file mode 100644
index 000000000..56791b3ba
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-block-margin.html
@@ -0,0 +1,65 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for box-decoration-break:clone, block margin</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1025669">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-block-margin-ref.html">
+ <meta charset="utf-8">
+ <style type="text/css">
+ html,body {
+ color:black; background-color:white; font-size:16px; padding:10px; margin:0;
+ }
+
+ .inner {
+ box-decoration-break: clone;
+ border: 5px dashed blue;
+ margin: 7px 3px 5px 1px;
+ height: 78px;
+ width: 40px;
+ background: lime;
+ background-clip: content-box;
+ }
+
+ .columns {
+ -moz-columns: 3;
+ width: 250px;
+ height: 50px;
+ background: grey;
+ margin-top: 2px;
+ }
+
+ .unbalanced {
+ -moz-column-fill: auto;
+ }
+
+ .inner.p { height:87px; }
+ .inner.p2 { height:84px; }
+
+ .p3, .p4, .p5, .p6 { border-style:none; }
+ .inner div { height:16px; }
+ .inner.p3 div { margin: 3px; }
+ .inner.p4 div { margin: 11px 3px 5px 1px; }
+ .inner.p5 div { box-decoration-break: clone; margin: 3px; }
+ .inner.p6 div { box-decoration-break: clone; margin: 11px 3px 5px 1px; }
+ </style>
+</head>
+<body>
+
+<div class="columns"><div class="inner"></div></div>
+<div class="columns unbalanced"><div class="inner"></div></div>
+<div class="columns"><div class="p inner"></div></div>
+<div class="columns unbalanced"><div class="p2 inner"></div></div>
+
+<!-- margin collapsing with innermost DIV -->
+<div class="columns unbalanced"><div class="p3 inner"><div></div></div></div>
+<div class="columns unbalanced"><div class="p4 inner"><div></div></div></div>
+<div class="columns unbalanced"><div class="p5 inner"><div></div></div></div>
+<div class="columns unbalanced"><div class="p6 inner"><div></div></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-border-image-ref.html b/layout/reftests/css-break/box-decoration-break-border-image-ref.html
new file mode 100644
index 000000000..a5a108a82
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-border-image-ref.html
@@ -0,0 +1,138 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for border-image + box-decoration-break</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=988653">
+ <meta charset="utf-8">
+ <style type="text/css">
+@font-face {
+ font-family: DejaVuSansMono;
+ src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff);
+}
+* { font-family: DejaVuSansMono; }
+
+html,body {
+ color:black; background-color:white; font-size:16px; padding:0; padding-left:10px; margin:0;
+}
+
+b1,b2,b3,b4,b5,b6,b7,b8,b9,b10,.b.clone {
+ border: 5px solid red;
+ border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAIAAAD%2FgAIDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAoUlEQVR42u3bwQ0AIAgEwcOmtXttgScmsxWQCTyp3EysJo61IliwYMGCBUuwYMGCBQuWYMGCBQsWLMGCBQsWLFiCBQsWLFiwBAsWLFiwYAkWLFiwYMESLFiwYMGCpXaVka%2BsO8dmOUNYggULFixYsAQLFixYsGAJFixYsGDBEixYsGDBgiVYsGDBggVLsGDBggULlmDBggULFizBggUL1t89N%2FYEtBGStpoAAAAASUVORK5CYII%3D) 10 10 repeat;
+ border-image-outset: 7px 3px 5px 9px;
+}
+.b {
+ border: 5px solid transparent;
+ background: pink;
+}
+.b.clone {
+ background: pink;
+ height:28px;
+}
+.col3 .b.clone {
+ height:32px;
+}
+
+.columns {
+ -moz-columns: 2;
+ width: 200px;
+ height: 50px;
+ background: grey;
+ margin-right: 20px;
+ margin-bottom: 20px;
+ float:left;
+}
+.col3 {
+ -moz-columns: 3;
+}
+.unbalanced { -moz-column-fill:auto; }
+.vbreak { height:65px; width:41px; }
+.unbalanced .vbreak { height:40px; }
+.h { width:30px;height:30px; background:grey; }
+.m { margin-left:15px; }
+.col3 .vbreak { height:115px; }
+.unbalanced.col3 .vbreak { height:40px; }
+x { display:inline-block; width:31px; height:18px; line-height:1; }
+y { display:inline-block; width:47px; height:18px; line-height:1; }
+pos1 { position:absolute; top:50px; width:700px; }
+pos2 { position:absolute; top:150px; width:700px; }
+pos3 { position:absolute; top:380px; width:700px; }
+pos4 { position:absolute; top:510px; width:700px; }
+
+b1,b2,b3,b4,b5,b6,b7,b8,b9,b10,c1,c2,c3,c4,c5,c6,c7,c8,c9,c10,m1,m2,m3,m4,m5,m6,m7,m8,m9,m10 {position:absolute;}
+c1,c2,c3,c4,c5,c6,c7,c8,c9,c10 {position:absolute; overflow:hidden; z-index:1;}
+
+
+b1 { top:50px; left:20px; height:65px; width:41px; }
+c1 { top:0; left:0; height:88px; width:200px; }
+
+b2 { top:-38px; left:128px; height:66px; width:41px; }
+c2 { top:50px; left:0; height:61px; width:200px; }
+
+b3 { top:50px; left:240px; height:115px; width:41px; }
+c3 { top:0; left:0; height:92px; width:600px; }
+
+b4 { top:-42px; left:312px; height:115px; width:41px; }
+c4 { top:50px; left:0; height:42px; width:600px; }
+
+b5 { top:-84px; left:384px; height:116px; width:41px; }
+c5 { top:50px; left:0; height:100px; width:600px; }
+
+b6 { top:148px; left:20px; height:19px; z-index:1; }
+m6 { top:135px; left:56px; height:55px; width:100px; background:white; z-index:2; }
+
+b7 { top:30px; left:-36px; width:78px; height:19px; }
+c7 { top:170px; left:20px; height:300px; width:200px; }
+
+b8 { top:30px; left:77px; width:125px; height:19px; }
+m8 { top:15px; left:113px; width:125px; height:55px; background:white; }
+c8 { top:170px; left:20px; height:300px; width:600px; }
+
+b9 { top:30px; left:-36px; width:125px; height:19px; }
+c9 { top:222px; left:20px; height:300px; width:47px; }
+
+b10 { top:30px; left:-83px; width:125px; height:19px; }
+c10 { top:274px; left:20px; height:300px; width:156px; }
+
+ </style>
+</head>
+<body>
+<c1><b1></b1></c1>
+<c2><b2></b2></c2>
+<c3><b3></b3></c3>
+<c4><b4></b4></c4>
+<c5><b5></b5></c5>
+<b6><x></x><y></y><br></b6><m6></m6>
+<c7><b7><x></x><y></y></b7></c7>
+<c8><b8><x></x><y></y><y></y></b8><m8></m8></c8>
+<c9><b9><x></x><y></y><y></y></b9></c9>
+<c10><b10><x></x><y></y><y></y></b10></c10>
+<pre>box-decoration-break:slice</pre>
+
+<pos1>
+<div class="columns"><div class="b vbreak slice"></div></div>
+<div class="columns col3"><div class="b vbreak slice"></div></div>
+</pos1>
+
+<pos2>
+<span class="b slice"><x></x><div class="h"></div><y></y></span>
+<span class="b slice m"><x></x><div class="h"></div><y></y><div class="h"></div><y></y></span>
+
+<pre>box-decoration-break:clone</pre>
+</pos2>
+
+<pos3>
+<div class="unbalanced columns"><div class="b vbreak clone"></div><div class="b vbreak clone" style="height:25px"></div></div>
+<div class="unbalanced columns col3"><div class="b vbreak clone"></div><div class="b vbreak clone"></div><div class="b vbreak clone" style="height:35px"></div></div>
+</pos3>
+
+<pos4>
+<span class="b clone"><x></x></span><div class="h"></div><span class="b clone"><y></y></span>
+<span class="b clone m"><x></x></span><div class="h"></div><span class="b clone m"><y></y></span><div class="h"></div><span class="b clone m"><y></y></span>
+</pos4>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-border-image.html b/layout/reftests/css-break/box-decoration-break-border-image.html
new file mode 100644
index 000000000..4de2734cc
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-border-image.html
@@ -0,0 +1,84 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>Testcase for border-image + box-decoration-break</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=988653">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-border-image-ref.html">
+ <meta charset="utf-8">
+ <style type="text/css">
+@font-face {
+ font-family: DejaVuSansMono;
+ src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff);
+}
+* { font-family: DejaVuSansMono; }
+
+html,body {
+ color:black; background-color:white; font-size:16px; padding:0; padding-left:10px; margin:0;
+}
+
+.b {
+ border: 5px solid red;
+ border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAIAAAD%2FgAIDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAoUlEQVR42u3bwQ0AIAgEwcOmtXttgScmsxWQCTyp3EysJo61IliwYMGCBUuwYMGCBQuWYMGCBQsWLMGCBQsWLFiCBQsWLFiwBAsWLFiwYAkWLFiwYMESLFiwYMGCpXaVka%2BsO8dmOUNYggULFixYsAQLFixYsGAJFixYsGDBEixYsGDBgiVYsGDBggVLsGDBggULlmDBggULFizBggUL1t89N%2FYEtBGStpoAAAAASUVORK5CYII%3D) 10 10 repeat;
+ background: pink;
+ border-image-outset: 7px 3px 5px 9px;
+}
+
+.columns {
+ -moz-columns: 2;
+ width: 200px;
+ height: 50px;
+ background: grey;
+ margin-right: 20px;
+ margin-bottom: 20px;
+ float:left;
+}
+.col3 {
+ -moz-columns: 3;
+}
+.unbalanced { -moz-column-fill:auto; }
+.vbreak { height:65px; width:41px; }
+.h { width:30px;height:30px; background:grey; }
+.m { margin-left:15px; }
+.col3 .vbreak { height:115px; }
+.clone { box-decoration-break:clone; }
+.slice { box-decoration-break:slice; }
+x { display:inline-block; width:31px; height:18px; line-height:1; }
+y { display:inline-block; width:47px; height:18px; line-height:1; }
+pos1 { position:absolute; top:50px; width:700px; }
+pos2 { position:absolute; top:150px; width:700px; }
+pos3 { position:absolute; top:380px; width:700px; }
+pos4 { position:absolute; top:510px; width:700px; }
+ </style>
+</head>
+<body>
+<pre>box-decoration-break:slice</pre>
+
+<pos1>
+<div class="columns"><div class="b vbreak slice"></div></div>
+<div class="columns col3"><div class="b vbreak slice"></div></div>
+</pos1>
+
+<pos2>
+<span class="b slice" style="border-style:dashed;"><x></x><div class="h"></div><y></y></span>
+<span class="b slice m" style="border-style:dashed;"><x></x><div class="h"></div><y></y><div class="h"></div><y></y></span>
+
+<pre>box-decoration-break:clone</pre>
+</pos2>
+
+<pos3>
+<div class="unbalanced columns"><div class="b vbreak clone"></div></div>
+<div class="unbalanced columns col3"><div class="b vbreak clone"></div></div>
+</pos3>
+
+<pos4>
+<span class="b clone" style="border-style:dashed;"><x></x><div class="h"></div><y></y></span>
+<span class="b clone m" style="border-style:dashed;"><x></x><div class="h"></div><y></y><div class="h"></div><y></y></span>
+</pos4>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-bug-1235152-ref.html b/layout/reftests/css-break/box-decoration-break-bug-1235152-ref.html
new file mode 100644
index 000000000..ec5379802
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-bug-1235152-ref.html
@@ -0,0 +1,57 @@
+<!DOCTYPE HTML>
+<html><head>
+ <meta charset="utf-8">
+ <title>Testcase for bug 1235152</title>
+ <style type="text/css">
+html,body {
+ color:black; background-color:white; font: 16px monospace;
+}
+
+div {
+ float: left;
+ background: #ccc;
+ clear: both;
+ padding-left: 10px;
+}
+
+.rtl {
+ direction: rtl;
+}
+.pr {
+ padding-left: 0;
+ padding-right: 13px;
+}
+.plr {
+ padding-right: 13px;
+}
+
+</style>
+</head>
+<body>
+
+<div class="rtl">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl pr">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl plr">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl" style="width:190px">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl pr" style="width:187px">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl plr" style="width:177px">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-bug-1235152.html b/layout/reftests/css-break/box-decoration-break-bug-1235152.html
new file mode 100644
index 000000000..7cb9fc923
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-bug-1235152.html
@@ -0,0 +1,61 @@
+<!DOCTYPE HTML>
+<html><head>
+ <meta charset="utf-8">
+ <title>Testcase for bug 1235152</title>
+ <style type="text/css">
+html,body {
+ color:black; background-color:white; font: 16px monospace;
+}
+
+div {
+ float: left;
+ background: #ccc;
+ clear: both;
+}
+
+.rtl {
+ direction: rtl;
+}
+
+span {
+ box-decoration-break: clone;
+ padding-left: 10px;
+}
+.pr {
+ padding-left: 0;
+ padding-right: 13px;
+}
+.plr {
+ padding-right: 13px;
+}
+
+</style>
+</head>
+<body>
+
+<div class="rtl">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl">
+ <span class="pr">לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl">
+ <span class="plr">לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl" style="width:200px">
+ <span>לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl" style="width:200px">
+ <span class="pr">לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+<div class="rtl" style="width:200px">
+ <span class="plr">לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית קונסקטורר</span>
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-bug-1249913-ref.html b/layout/reftests/css-break/box-decoration-break-bug-1249913-ref.html
new file mode 100644
index 000000000..707ea6dc9
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-bug-1249913-ref.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+ <meta charset="utf-8">
+ <title>'box-decoration-break' with child overflow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1249913">
+ <style type="text/css">
+body,html { color:black; background:white; font-size:16px; padding:0; margin:0; }
+
+p { height: 27px; width: 100px; margin:0; background:lime; }
+.border { border:3px solid black; }
+.outline { outline:3px solid brown; }
+.shadow { box-shadow: 2px 2px 0 0 blue; }
+
+.columns {
+ -moz-columns: 2;
+ -ms-columns: 2;
+ -webkit-columns: 2;
+ columns: 2;
+ -moz-column-fill: auto;
+ -ms-column-fill: auto;
+ -webkit-column-fill: auto;
+ column-fill: auto;
+ width:500px;
+ height:30px;
+ border:solid silver;
+ margin: 2px 0;
+}
+
+.columns div { height: 10px; }
+
+x { height: 27px; width: 100px; margin:0; background:lime; display:block; }
+y { height: 23px; width: 100px; margin:0; background:lime; display:block; }
+
+</style>
+</head>
+<body>
+
+<div class="columns"><div class="border"><p></p><y></y></div></div>
+<div class="columns"><div class="outline"><p style="height:30px"></p><y style="height:20px"></y></div></div>
+<div class="columns"><div class="shadow"><p style="height:30px"></p><y style="height:20px"></y></div></div>
+<div class="columns"><div class="border outline"><p></p><y></y></div></div>
+<div class="columns"><div class="border shadow"><p></p><y></y></div></div>
+
+<div class="columns"><div class="border"><x></x><y></y></div></div>
+<div class="columns"><div class="outline"><x></x><y></y></div></div>
+<div class="columns"><div class="shadow"><x></x><y></y></div></div>
+<div class="columns"><div class="border outline"><x></x><y></y></div></div>
+<div class="columns"><div class="border shadow"><x></x><y></y></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-bug-1249913.html b/layout/reftests/css-break/box-decoration-break-bug-1249913.html
new file mode 100644
index 000000000..67b5c753f
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-bug-1249913.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+ <meta charset="utf-8">
+ <title>'box-decoration-break' with child overflow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1249913">
+ <link rel="help" href="https://drafts.csswg.org/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-bug-1249913-ref.html">
+ <style type="text/css">
+body,html { color:black; background:white; font-size:16px; padding:0; margin:0; }
+
+p { height: 50px; width: 100px; margin:0; background:lime; }
+.clone { height: 10px; box-decoration-break:clone; }
+.border { border:3px solid black; }
+.outline { outline:3px solid brown; }
+.shadow { box-shadow: 2px 2px 0 0 blue; }
+
+.columns {
+ -moz-columns: 2;
+ -ms-columns: 2;
+ -webkit-columns: 2;
+ columns: 2;
+ -moz-column-fill: auto;
+ -ms-column-fill: auto;
+ -webkit-column-fill: auto;
+ column-fill: auto;
+ width:500px;
+ height:30px;
+ border:solid silver;
+ margin: 2px 0;
+}
+
+.columns div { height: 10px; }
+
+</style>
+</head>
+<body>
+
+<div class="columns"><div class="clone border"><p></p></div></div>
+<div class="columns"><div class="clone outline"><p></p></div></div>
+<div class="columns"><div class="clone shadow"><p></p></div></div>
+<div class="columns"><div class="clone border outline"><p></p></div></div>
+<div class="columns"><div class="clone border shadow"><p></p></div></div>
+
+<div class="columns"><div class="border"><p></p></div></div>
+<div class="columns"><div class="outline"><p></p></div></div>
+<div class="columns"><div class="shadow"><p></p></div></div>
+<div class="columns"><div class="border outline"><p></p></div></div>
+<div class="columns"><div class="border shadow"><p></p></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-first-letter-ref.html b/layout/reftests/css-break/box-decoration-break-first-letter-ref.html
new file mode 100644
index 000000000..4875b4716
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-first-letter-ref.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>::first-letter with border-radius</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1067088">
+<style>
+html,body { color:black; background-color:white; font-size:24px; }
+div { line-height:36px; }
+.b { background: blue; }
+.r100p { border-radius: 100%; }
+.r10p { border-radius: 10%; }
+.s1 { border:1px solid black; }
+.i { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR%2FmAAAAAXNSR0IArs4c6QAAADpJREFUWMPtzgENAAAIA6Br%2F85aQzdIQGVyUCdaWlpaWlpaWlpaWlpaWlpaWlpaWlpaWlpaWlpan1oLQKsBY3S7VU8AAAAASUVORK5CYII%3D); }
+.shadowi { box-shadow: inset 15px 9px 7px 0px #00F; }
+.shadowo { box-shadow: 0px 0px 7px 0px #00F;}
+.shadowio { box-shadow: inset 15px 9px 7px 0px #00F, 0px 0px 7px 0px #00F;}
+.bi {
+ border: 5px solid red;
+ border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAIAAAD%2FgAIDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAoUlEQVR42u3bwQ0AIAgEwcOmtXttgScmsxWQCTyp3EysJo61IliwYMGCBUuwYMGCBQuWYMGCBQsWLMGCBQsWLFiCBQsWLFiwBAsWLFiwYAkWLFiwYMESLFiwYMGCpXaVka%2BsO8dmOUNYggULFixYsAQLFixYsGAJFixYsGDBEixYsGDBgiVYsGDBggVLsGDBggULlmDBggULFizBggUL1t89N%2FYEtBGStpoAAAAASUVORK5CYII%3D) 10 10 repeat;
+ background: pink;
+ border-image-outset: 7px 3px 5px 9px;
+}
+</style>
+</head>
+<body>
+<table cellpadding="10"><tr><td>
+ <div><span class="b r100p">F</span>irst-letter</div>
+ <div><span class="b r10p">F</span>irst-letter</div>
+ <div><span class="b s1 r100p">F</span>irst-letter</div>
+ <div><span class="b s1 r10p">F</span>irst-letter</div>
+ <div><span class="shadowo r100p">F</span>irst-letter</div>
+ <div><span class="shadowo s1 r10p">F</span>irst-letter</div>
+ <div><span class="shadowi s1 r100p">F</span>irst-letter</div>
+ <div><span class="shadowi r10p">F</span>irst-letter</div>
+ <div><span class="shadowio r100p">F</span>irst-letter</div>
+ <div><span class="shadowio s1 r10p">F</span>irst-letter</div>
+ <div><span class="s1 r100p">F</span>irst-letter</div>
+ <div><span class="s1 r10p">F</span>irst-letter</div>
+ <div><span class="i r100p">F</span>irst-letter</div>
+ <div><span class="i r10p">F</span>irst-letter</div>
+ <div><span class="i s1 r100p">F</span>irst-letter</div>
+ <div><span class="i s1 r10p">F</span>irst-letter</div>
+ <div><span class="bi">F</span>irst-letter</div>
+</td>
+<td>
+ <div><span class="b r100p">F</span>irst-letter</div>
+ <div><span class="b r10p">F</span>irst-letter</div>
+ <div><span class="b s1 r100p">F</span>irst-letter</div>
+ <div><span class="b s1 r10p">F</span>irst-letter</div>
+ <div><span class="shadowo r100p">F</span>irst-letter</div>
+ <div><span class="shadowo s1 r10p">F</span>irst-letter</div>
+ <div><span class="shadowi s1 r100p">F</span>irst-letter</div>
+ <div><span class="shadowi r10p">F</span>irst-letter</div>
+ <div><span class="shadowio r100p">F</span>irst-letter</div>
+ <div><span class="shadowio s1 r10p">F</span>irst-letter</div>
+ <div><span class="s1 r100p">F</span>irst-letter</div>
+ <div><span class="s1 r10p">F</span>irst-letter</div>
+ <div><span class="i r100p">F</span>irst-letter</div>
+ <div><span class="i r10p">F</span>irst-letter</div>
+ <div><span class="i s1 r100p">F</span>irst-letter</div>
+ <div><span class="i s1 r10p">F</span>irst-letter</div>
+ <div><span class="bi">F</span>irst-letter</div>
+</td>
+</tr></table>
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-first-letter.html b/layout/reftests/css-break/box-decoration-break-first-letter.html
new file mode 100644
index 000000000..16853af33
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-first-letter.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>::first-letter with border-radius</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1067088">
+<style>
+html,body { color:black; background-color:white; font-size:24px; }
+div { line-height:36px; }
+.b::first-letter { background: blue; }
+.c::first-letter { box-decoration-break:clone; }
+.r100p::first-letter { border-radius: 100%; }
+.r10p::first-letter { border-radius: 10%; }
+.s1::first-letter { border:1px solid black; }
+.i::first-letter { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR%2FmAAAAAXNSR0IArs4c6QAAADpJREFUWMPtzgENAAAIA6Br%2F85aQzdIQGVyUCdaWlpaWlpaWlpaWlpaWlpaWlpaWlpaWlpaWlpan1oLQKsBY3S7VU8AAAAASUVORK5CYII%3D); }
+.shadowi::first-letter { box-shadow: inset 15px 9px 7px 0px #00F; }
+.shadowo::first-letter { box-shadow: 0px 0px 7px 0px #00F;}
+.shadowio::first-letter { box-shadow: inset 15px 9px 7px 0px #00F, 0px 0px 7px 0px #00F;}
+.bi::first-letter {
+ border: 5px solid red;
+ border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAIAAAD%2FgAIDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAoUlEQVR42u3bwQ0AIAgEwcOmtXttgScmsxWQCTyp3EysJo61IliwYMGCBUuwYMGCBQuWYMGCBQsWLMGCBQsWLFiCBQsWLFiwBAsWLFiwYAkWLFiwYMESLFiwYMGCpXaVka%2BsO8dmOUNYggULFixYsAQLFixYsGAJFixYsGDBEixYsGDBgiVYsGDBggVLsGDBggULlmDBggULFizBggUL1t89N%2FYEtBGStpoAAAAASUVORK5CYII%3D) 10 10 repeat;
+ background: pink;
+ border-image-outset: 7px 3px 5px 9px;
+}
+</style>
+</head>
+<body>
+<table cellpadding="10"><tr><td>
+ <div class="b r100p">First-letter</div>
+ <div class="b r10p">First-letter</div>
+ <div class="b s1 r100p">First-letter</div>
+ <div class="b s1 r10p">First-letter</div>
+ <div class="shadowo r100p">First-letter</div>
+ <div class="shadowo s1 r10p">First-letter</div>
+ <div class="shadowi s1 r100p">First-letter</div>
+ <div class="shadowi r10p">First-letter</div>
+ <div class="shadowio r100p">First-letter</div>
+ <div class="shadowio s1 r10p">First-letter</div>
+ <div class="s1 r100p">First-letter</div>
+ <div class="s1 r10p">First-letter</div>
+ <div class="i r100p">First-letter</div>
+ <div class="i r10p">First-letter</div>
+ <div class="i s1 r100p">First-letter</div>
+ <div class="i s1 r10p">First-letter</div>
+ <div class="bi">First-letter</div>
+</td>
+<td>
+ <!-- box-decoration-break:clone should render the same for ::first-letter -->
+ <div class="c b r100p">First-letter</div>
+ <div class="c b r10p">First-letter</div>
+ <div class="c b s1 r100p">First-letter</div>
+ <div class="c b s1 r10p">First-letter</div>
+ <div class="c shadowo r100p">First-letter</div>
+ <div class="c shadowo s1 r10p">First-letter</div>
+ <div class="c shadowi s1 r100p">First-letter</div>
+ <div class="c shadowi r10p">First-letter</div>
+ <div class="c shadowio r100p">First-letter</div>
+ <div class="c shadowio s1 r10p">First-letter</div>
+ <div class="c s1 r100p">First-letter</div>
+ <div class="c s1 r10p">First-letter</div>
+ <div class="c i r100p">First-letter</div>
+ <div class="c i r10p">First-letter</div>
+ <div class="c i s1 r100p">First-letter</div>
+ <div class="c i s1 r10p">First-letter</div>
+ <div class="c bi">First-letter</div>
+</td>
+</tr></table>
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-with-bidi-ref.html b/layout/reftests/css-break/box-decoration-break-with-bidi-ref.html
new file mode 100644
index 000000000..976d5b5ce
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-bidi-ref.html
@@ -0,0 +1,74 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+ <meta charset="utf-8">
+ <title>Testing box-decoration-break with bidi resolution</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1210877">
+ <style type="text/css">
+
+.test {
+ box-decoration-break: slice;
+ background: black;
+}
+.p {
+ padding:11px 3px 5px 7px;
+}
+.b {
+ border: 1px solid blue;
+ border-width:3px 5px 7px 11px;
+}
+.m {
+ margin:5px 7px 11px 3px;
+}
+.direction {
+ direction: rtl;
+}
+
+x {display:inline-block; width:20px; height:10px; background:lime; }
+y {display:inline-block; width:30px; height:1px; background:lime; }
+d {display:inline-block; border:10px solid red }
+ </style>
+</head>
+<body>
+
+<div style="float:left; width: 100px;">
+<span class="test p"><x></x></span><br>
+<span class="test p"><y></y></span><br><br><br>
+<span class="test b"><x></x></span><br>
+<span class="test b"><y></y></span><br><br><br>
+<span class="test p b"><x></x></span><br>
+<span class="test p b"><y></y></span><br><br><br>
+<span class="test m"><x></x></span><br>
+<span class="test m"><y></y></span><br><br><br>
+<span class="test p m"><x></x></span><br>
+<span class="test p m"><y></y></span><br><br><br>
+<span class="test b m"><x></x></span><br>
+<span class="test b m"><y></y></span><br><br><br>
+<span class="test p b m"><x></x></span><br>
+<span class="test p b m"><y></y></span><br><br><br>
+
+
+</div><div style="float:left; width: 100px; text-align:right">
+
+<span class="test p"><y></y></span><br>
+<span class="test p"><x></x></span><br><br><br>
+<span class="test b"><y></y></span><br>
+<span class="test b"><x></x></span><br><br><br>
+<span class="test p b"><y></y></span><br>
+<span class="test p b"><x></x></span><br><br><br>
+<span class="test m"><y></y></span><br>
+<span class="test m"><x></x></span><br><br><br>
+<span class="test p m"><y></y></span><br>
+<span class="test p m"><x></x></span><br><br><br>
+<span class="test b m"><y></y></span><br>
+<span class="test b m"><x></x></span><br><br><br>
+<span class="test p b m"><y></y></span><br>
+<span class="test p b m"><x></x></span><br><br><br>
+
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-with-bidi.html b/layout/reftests/css-break/box-decoration-break-with-bidi.html
new file mode 100644
index 000000000..1dec2105f
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-bidi.html
@@ -0,0 +1,64 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+ <meta charset="utf-8">
+ <title>Testing box-decoration-break with bidi resolution</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1210877">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-with-bidi-ref.html">
+ <style type="text/css">
+
+.test {
+ box-decoration-break: clone;
+ background: black;
+}
+.p {
+ padding:11px 3px 5px 7px;
+}
+.b {
+ border: 1px solid blue;
+ border-width:3px 5px 7px 11px;
+}
+.m {
+ margin:5px 7px 11px 3px;
+}
+.direction {
+ direction: rtl;
+}
+
+x {display:inline-block; width:20px; height:10px; background:lime; }
+y {display:inline-block; width:30px; height:1px; background:lime; }
+d {display:inline-block; border:10px solid red }
+ </style>
+</head>
+<body>
+
+<div style="float:left; width: 100px;">
+<span class="test p"><x></x><br><y></y></span><br><br><br>
+<span class="test b"><x></x><br><y></y></span><br><br><br>
+<span class="test p b"><x></x><br><y></y></span><br><br><br>
+<span class="test m"><x></x><br><y></y></span><br><br><br>
+<span class="test p m"><x></x><br><y></y></span><br><br><br>
+<span class="test b m"><x></x><br><y></y></span><br><br><br>
+<span class="test p b m"><x></x><br><y></y></span><br><br><br>
+
+<div class="direction"></div> <!-- to trigger bidi resolution -->
+
+</div><div style="float:left; width: 100px; text-align:right">
+
+<span class="test p"><y></y><br><x></x></span><br><br><br>
+<span class="test b"><y></y><br><x></x></span><br><br><br>
+<span class="test p b"><y></y><br><x></x></span><br><br><br>
+<span class="test m"><y></y><br><x></x></span><br><br><br>
+<span class="test p m"><y></y><br><x></x></span><br><br><br>
+<span class="test b m"><y></y><br><x></x></span><br><br><br>
+<span class="test p b m"><y></y><br><x></x></span><br><br><br>
+
+<div class="direction"></div> <!-- to trigger bidi resolution -->
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1-ref.html b/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1-ref.html
new file mode 100644
index 000000000..f372a0f92
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1-ref.html
@@ -0,0 +1,132 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone with inset box-shadow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <meta charset="utf-8">
+<style>
+span { border:3px dashed pink; margin:0 1em; line-height:4em; }
+
+span {
+ font-family:monospace;
+ padding:1em 1em;
+ background-image: url(green-circle-alpha-32x32.png);
+}
+.o0 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 0px 10px #00F;
+ box-shadow: inset 0px 0px 0px 10px #00F;
+}
+.o10 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 7px 10px #00F;
+ box-shadow: inset 0px 0px 7px 10px #00F;
+}
+.o10x {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 7px 0px #00F;
+ box-shadow: inset 0px 0px 7px 0px #00F;
+}
+.p0 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 0px 10px #00F;
+ box-shadow: inset 15px 9px 0px 10px #00F;
+}
+.p10 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 7px 10px #00F;
+ box-shadow: inset 15px 9px 7px 10px #00F;
+}
+.p10x {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 7px 0px #00F;
+ box-shadow: inset 15px 9px 7px 0px #00F;
+}
+.so0 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 0px 10px #00F;
+ box-shadow: inset 0px 0px 0px 10px #00F;
+}
+.so10 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 7px 10px #00F;
+ box-shadow: inset 0px 0px 7px 10px #00F;
+}
+.so10x {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 7px 0px #00F;
+ box-shadow: inset 0px 0px 7px 0px #00F;
+}
+.sp0 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 0px 10px #00F;
+ box-shadow: inset 15px 9px 0px 10px #00F;
+}
+.sp10 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 7px 10px #00F;
+ box-shadow: inset 15px 9px 7px 10px #00F;
+}
+.sp10x {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 7px 0px #00F;
+ box-shadow: inset 15px 9px 7px 0px #00F;
+}
+
+.m b { visibility:hidden; }
+.m { box-shadow:none; background:none; border-style:solid; border-radius:0; border-color:transparent; }
+.m.o0, .m.o10, .m.o10x, .m.p0, .m.p10, .m.p10x { border-bottom-color: black; }
+</style>
+</head>
+<body style="margin:49px 50px;">
+
+<div style="position:relative">
+<table border=1 cellpadding=10><tr><td>
+<span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br></span><span class="p0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="p10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="p10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+
+<div style="position:absolute; top:0px;left:0;">
+<!-- mask out 1px of outer edge of the rounded borders at some places due to rounding errors -->
+<table border=1 cellpadding=10><tr><td>
+<span class="m o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br></span><span class="m p0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m p10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m p10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+</div>
+
+</div>
+
+</body>
+
diff --git a/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1.html b/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1.html
new file mode 100644
index 000000000..97e64700c
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-inset-box-shadow-1.html
@@ -0,0 +1,134 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone with inset box-shadow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-with-inset-box-shadow-1-ref.html">
+ <meta charset="utf-8">
+<style>
+span { border:3px dashed pink; margin:0 1em; line-height:4em; box-decoration-break:clone; }
+
+span {
+ font-family:monospace;
+ padding:1em 1em;
+ background-image: url(green-circle-alpha-32x32.png);
+}
+.o0 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 0px 10px #00F;
+ box-shadow: inset 0px 0px 0px 10px #00F;
+}
+.o10 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 7px 10px #00F;
+ box-shadow: inset 0px 0px 7px 10px #00F;
+}
+.o10x {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 0px 0px 7px 0px #00F;
+ box-shadow: inset 0px 0px 7px 0px #00F;
+}
+.p0 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 0px 10px #00F;
+ box-shadow: inset 15px 9px 0px 10px #00F;
+}
+.p10 {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 7px 10px #00F;
+ box-shadow: inset 15px 9px 7px 10px #00F;
+}
+.p10x {
+ border-radius: 12px;
+ -webkit-box-shadow: inset 15px 9px 7px 0px #00F;
+ box-shadow: inset 15px 9px 7px 0px #00F;
+}
+.so0 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 0px 10px #00F;
+ box-shadow: inset 0px 0px 0px 10px #00F;
+}
+.so10 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 7px 10px #00F;
+ box-shadow: inset 0px 0px 7px 10px #00F;
+}
+.so10x {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 0px 0px 7px 0px #00F;
+ box-shadow: inset 0px 0px 7px 0px #00F;
+}
+.sp0 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 0px 10px #00F;
+ box-shadow: inset 15px 9px 0px 10px #00F;
+}
+.sp10 {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 7px 10px #00F;
+ box-shadow: inset 15px 9px 7px 10px #00F;
+}
+.sp10x {
+ border-radius: 0px;
+ -webkit-box-shadow: inset 15px 9px 7px 0px #00F;
+ box-shadow: inset 15px 9px 7px 0px #00F;
+}
+
+.m b { visibility:hidden; }
+.m { box-shadow:none; background:none; border-style:solid; border-radius:0; border-color:transparent; }
+.m.o0, .m.o10, .m.o10x, .m.p0, .m.p10, .m.p10x { border-bottom-color: black; }
+</style>
+</head>
+<body style="margin:49px 50px;">
+
+<div style="position:relative">
+<table border=1 cellpadding=10><tr><td>
+<span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+
+<div style="position:absolute; top:0px;left:0;">
+<!-- mask out 1px of outer edge of the rounded borders at some places due to rounding errors -->
+<table border=1 cellpadding=10><tr><td>
+<span class="m o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+</div>
+
+</div>
+
+</body>
+</html>
diff --git a/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1-ref.html b/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1-ref.html
new file mode 100644
index 000000000..938fc3914
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1-ref.html
@@ -0,0 +1,131 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone with outset box-shadow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <meta charset="utf-8">
+<style>
+span { border:3px dashed pink; line-height:80px; }
+
+span {
+ font-family:monospace;
+ padding:1em 1em;
+ background-image: url(green-circle-alpha-32x32.png);
+}
+.o0 {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 0px 10px #00F;
+ box-shadow: 0px 0px 0px 10px #00F;
+}
+.o10 {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 7px 10px #00F;
+ box-shadow: 0px 0px 7px 10px #00F;
+}
+.o10x {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 7px 0px #00F;
+ box-shadow: 0px 0px 7px 0px #00F;
+}
+.p0 {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 0px 10px #00F;
+ box-shadow: 15px 9px 0px 10px #00F;
+}
+.p10 {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 7px 10px #00F;
+ box-shadow: 15px 9px 7px 10px #00F;
+}
+.p10x {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 7px 0px #00F;
+ box-shadow: 15px 9px 7px 0px #00F;
+}
+.so0 {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 0px 10px #00F;
+ box-shadow: 0px 0px 0px 10px #00F;
+}
+.so10 {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 7px 10px #00F;
+ box-shadow: 0px 0px 7px 10px #00F;
+}
+.so10x {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 7px 0px #00F;
+ box-shadow: 0px 0px 7px 0px #00F;
+}
+.sp0 {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 0px 10px #00F;
+ box-shadow: 15px 9px 0px 10px #00F;
+}
+.sp10 {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 7px 10px #00F;
+ box-shadow: 15px 9px 7px 10px #00F;
+}
+.sp10x {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 7px 0px #00F;
+ box-shadow: 15px 9px 7px 0px #00F;
+}
+
+.m b { visibility:hidden; }
+.m { box-shadow:none; background:none; border-style:solid; border-radius:0; border-color:transparent; }
+.m.o0, .m.o10, .m.o10x, .m.p0, .m.p10, .m.p10x { border-bottom-color: black; }
+</style>
+</head>
+<body style="margin:49px 50px;">
+
+<div style="position:relative">
+<table border=1 cellpadding=50 ><tr><td>
+<span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="o10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="p0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="p10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="p10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="p10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="so10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="sp10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="sp10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+
+<div style="position:absolute; top:0px;left:0;">
+<!-- mask out 1px of outer edge of the rounded borders at some places due to rounding errors -->
+<table border=1 cellpadding=50 ><tr><td>
+<span class="m o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m o10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m o10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m p0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m p10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m p10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m p10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m so10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m so10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp0"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp0"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp10"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp10"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;</b></span><br><span class="m sp10x"><b>&nbsp;&nbsp;b&nbsp;&nbsp;</b></span><br><span class="m sp10x"><b>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+</div>
+
+</div>
+</body>
+
diff --git a/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1.html b/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1.html
new file mode 100644
index 000000000..417bf76ca
--- /dev/null
+++ b/layout/reftests/css-break/box-decoration-break-with-outset-box-shadow-1.html
@@ -0,0 +1,133 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html>
+<head>
+ <title>CSS Test: Testing box-decoration-break:clone with outset box-shadow</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
+ <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
+ <link rel="match" href="box-decoration-break-with-outset-box-shadow-1-ref.html">
+ <meta charset="utf-8">
+<style>
+span { border:3px dashed pink; line-height:80px; box-decoration-break:clone; }
+
+span {
+ font-family:monospace;
+ padding:1em 1em;
+ background-image: url(green-circle-alpha-32x32.png);
+}
+.o0 {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 0px 10px #00F;
+ box-shadow: 0px 0px 0px 10px #00F;
+}
+.o10 {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 7px 10px #00F;
+ box-shadow: 0px 0px 7px 10px #00F;
+}
+.o10x {
+ border-radius: 12px;
+ -webkit-box-shadow: 0px 0px 7px 0px #00F;
+ box-shadow: 0px 0px 7px 0px #00F;
+}
+.p0 {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 0px 10px #00F;
+ box-shadow: 15px 9px 0px 10px #00F;
+}
+.p10 {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 7px 10px #00F;
+ box-shadow: 15px 9px 7px 10px #00F;
+}
+.p10x {
+ border-radius: 12px;
+ -webkit-box-shadow: 15px 9px 7px 0px #00F;
+ box-shadow: 15px 9px 7px 0px #00F;
+}
+.so0 {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 0px 10px #00F;
+ box-shadow: 0px 0px 0px 10px #00F;
+}
+.so10 {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 7px 10px #00F;
+ box-shadow: 0px 0px 7px 10px #00F;
+}
+.so10x {
+ border-radius: 0px;
+ -webkit-box-shadow: 0px 0px 7px 0px #00F;
+ box-shadow: 0px 0px 7px 0px #00F;
+}
+.sp0 {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 0px 10px #00F;
+ box-shadow: 15px 9px 0px 10px #00F;
+}
+.sp10 {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 7px 10px #00F;
+ box-shadow: 15px 9px 7px 10px #00F;
+}
+.sp10x {
+ border-radius: 0px;
+ -webkit-box-shadow: 15px 9px 7px 0px #00F;
+ box-shadow: 15px 9px 7px 0px #00F;
+}
+
+.m b { visibility:hidden; }
+.m { box-shadow:none; background:none; border-style:solid; border-radius:0; border-color:transparent; }
+.m.o0, .m.o10, .m.o10x, .m.p0, .m.p10, .m.p10x { border-bottom-color: black; }
+</style>
+</head>
+<body style="margin:49px 50px;">
+
+<div style="position:relative">
+<table border=1 cellpadding=50 ><tr><td>
+<span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+
+<div style="position:absolute; top:0px;left:0;">
+<!-- mask out 1px of outer edge of the rounded borders at some places due to rounding errors -->
+<table border=1 cellpadding=50 ><tr><td>
+<span class="m o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m p0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m p10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td><td>
+<span class="m sp0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+<span class="m sp10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br>
+</td></tr>
+</table>
+</div>
+
+</div>
+</body>
+
diff --git a/layout/reftests/css-break/green-circle-alpha-32x32.png b/layout/reftests/css-break/green-circle-alpha-32x32.png
new file mode 100644
index 000000000..a007675a1
--- /dev/null
+++ b/layout/reftests/css-break/green-circle-alpha-32x32.png
Binary files differ
diff --git a/layout/reftests/css-break/reftest-stylo.list b/layout/reftests/css-break/reftest-stylo.list
new file mode 100644
index 000000000..4bc15ab56
--- /dev/null
+++ b/layout/reftests/css-break/reftest-stylo.list
@@ -0,0 +1,13 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+default-preferences pref(layout.css.box-decoration-break.enabled,true)
+
+== box-decoration-break-1.html box-decoration-break-1.html
+== box-decoration-break-with-inset-box-shadow-1.html box-decoration-break-with-inset-box-shadow-1.html
+fuzzy-if(Android,10,3673) fuzzy-if(skiaContent,32,254) == box-decoration-break-with-outset-box-shadow-1.html box-decoration-break-with-outset-box-shadow-1.html
+random-if(!gtkWidget) HTTP(..) == box-decoration-break-border-image.html box-decoration-break-border-image.html
+== box-decoration-break-block-border-padding.html box-decoration-break-block-border-padding.html
+== box-decoration-break-block-margin.html box-decoration-break-block-margin.html
+fails fuzzy-if(!Android,1,5) fuzzy-if(Android,8,6627) fuzzy-if(skiaContent,1,24) == box-decoration-break-first-letter.html box-decoration-break-first-letter.html
+== box-decoration-break-with-bidi.html box-decoration-break-with-bidi.html
+== box-decoration-break-bug-1235152.html box-decoration-break-bug-1235152.html
+== box-decoration-break-bug-1249913.html box-decoration-break-bug-1249913.html
diff --git a/layout/reftests/css-break/reftest.list b/layout/reftests/css-break/reftest.list
new file mode 100644
index 000000000..982b51476
--- /dev/null
+++ b/layout/reftests/css-break/reftest.list
@@ -0,0 +1,12 @@
+default-preferences pref(layout.css.box-decoration-break.enabled,true)
+
+== box-decoration-break-1.html box-decoration-break-1-ref.html
+fuzzy(1,20) fuzzy-if(skiaContent,1,700) == box-decoration-break-with-inset-box-shadow-1.html box-decoration-break-with-inset-box-shadow-1-ref.html
+fuzzy(16,460) fuzzy-if(Android,10,3673) fuzzy-if(skiaContent,32,254) == box-decoration-break-with-outset-box-shadow-1.html box-decoration-break-with-outset-box-shadow-1-ref.html
+random-if(!gtkWidget) HTTP(..) == box-decoration-break-border-image.html box-decoration-break-border-image-ref.html
+== box-decoration-break-block-border-padding.html box-decoration-break-block-border-padding-ref.html
+== box-decoration-break-block-margin.html box-decoration-break-block-margin-ref.html
+fuzzy-if(!Android,1,62) fuzzy-if(Android,8,6627) == box-decoration-break-first-letter.html box-decoration-break-first-letter-ref.html #Bug 1313773
+== box-decoration-break-with-bidi.html box-decoration-break-with-bidi-ref.html
+== box-decoration-break-bug-1235152.html box-decoration-break-bug-1235152-ref.html
+== box-decoration-break-bug-1249913.html box-decoration-break-bug-1249913-ref.html