1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/reftests/bugs/456219-1-ref.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,80 @@
1.4 +<!doctype html>
1.5 +<html><head>
1.6 +<title>background-clip interaction with border-radius</title>
1.7 +<style>
1.8 +/* If you fix bug #466572, you can substantially simplify this test
1.9 + case. */
1.10 +
1.11 +table { table-layout: fixed; width: 550px }
1.12 +td { width: 110px; height: 110px; text-align: center }
1.13 +div.i {
1.14 + z-index: 0;
1.15 + width: 70px;
1.16 + height: 70px;
1.17 + border-style: solid;
1.18 + border-color: transparent;
1.19 + background-color: green;
1.20 +}
1.21 +.rA div.i { border-radius: 10px; }
1.22 +.rB div.i { border-radius: 20px; }
1.23 +.rC div.i { border-radius: 30px; }
1.24 +.rD div.i { border-radius: 40px; }
1.25 +.rE div.i { border-radius: 50px; }
1.26 +
1.27 +.wA div.i { border-width: 10px 10px 10px 10px; }
1.28 +.wB div.i { border-width: 20px 20px 20px 20px; }
1.29 +.wC div.i { border-width: 5px 20px 5px 20px; }
1.30 +.wD div.i { border-width: 20px 20px 5px 5px; }
1.31 +.wE div.i { border-width: 5px 10px 15px 20px; }
1.32 +
1.33 +div.o {
1.34 + display: inline-block;
1.35 + position: relative;
1.36 +}
1.37 +img {
1.38 + position: absolute; top: 0; left: 0;
1.39 + z-index: 1;
1.40 +}
1.41 +</style>
1.42 +</head><body>
1.43 +<table>
1.44 +<tr class="wA">
1.45 + <td class="rA"><div class="o"><div class="i"></div><img src="456219-1-mask-wArA.png"></div></td>
1.46 + <td class="rB"><div class="o"><div class="i"></div><img src="456219-1-mask-wArB.png"></div></td>
1.47 + <td class="rC"><div class="o"><div class="i"></div><img src="456219-1-mask-wArC.png"></div></td>
1.48 + <td class="rD"><div class="o"><div class="i"></div><img src="456219-1-mask-wArD.png"></div></td>
1.49 + <td class="rE"><div class="o"><div class="i"></div><img src="456219-1-mask-wArE.png"></div></td>
1.50 +</tr>
1.51 +<tr class="wB">
1.52 + <td class="rA"><div class="o"><div class="i"></div><img src="456219-1-mask-wBrA.png"></div></td>
1.53 + <td class="rB"><div class="o"><div class="i"></div><img src="456219-1-mask-wBrB.png"></div></td>
1.54 + <td class="rC"><div class="o"><div class="i"></div><img src="456219-1-mask-wBrC.png"></div></td>
1.55 + <td class="rD"><div class="o"><div class="i"></div><img src="456219-1-mask-wBrD.png"></div></td>
1.56 + <td class="rE"><div class="o"><div class="i"></div><img src="456219-1-mask-wBrE.png"></div></td>
1.57 +</tr>
1.58 +<tr class="wC">
1.59 + <td class="rA"><div class="o"><div class="i"></div><img src="456219-1-mask-wCrA.png"></div></td>
1.60 + <td class="rB"><div class="o"><div class="i"></div><img src="456219-1-mask-wCrB.png"></div></td>
1.61 + <td class="rC"><div class="o"><div class="i"></div><img src="456219-1-mask-wCrC.png"></div></td>
1.62 + <td class="rD"><div class="o"><div class="i"></div><img src="456219-1-mask-wCrD.png"></div></td>
1.63 + <td class="rE"><div class="o"><div class="i"></div><img src="456219-1-mask-wCrE.png"></div></td>
1.64 +</tr>
1.65 +<tr class="wD">
1.66 + <td class="rA"><div class="o"><div class="i"></div><img src="456219-1-mask-wDrA.png"></div></td>
1.67 + <td class="rB"><div class="o"><div class="i"></div><img src="456219-1-mask-wDrB.png"></div></td>
1.68 + <td class="rC"><div class="o"><div class="i"></div><img src="456219-1-mask-wDrC.png"></div></td>
1.69 + <td class="rD"><div class="o"><div class="i"></div><img src="456219-1-mask-wDrD.png"></div></td>
1.70 + <td class="rE"><div class="o"><div class="i"></div><img src="456219-1-mask-wDrE.png"></div></td>
1.71 +</tr>
1.72 +<tr class="wE">
1.73 + <td class="rA"><div class="o"><div class="i"></div><img src="456219-1-mask-wErA.png"></div></td>
1.74 + <td class="rB"><div class="o"><div class="i"></div><img src="456219-1-mask-wErB.png"></div></td>
1.75 + <td class="rC"><div class="o"><div class="i"></div><img src="456219-1-mask-wErC.png"></div></td>
1.76 + <td class="rD"><div class="o"><div class="i"></div><img src="456219-1-mask-wErD.png"></div></td>
1.77 + <td class="rE"><div class="o"><div class="i"></div><img src="456219-1-mask-wErE.png"></div></td>
1.78 +</tr>
1.79 +</table>
1.80 +
1.81 +<p>Inside each green shape, there should be no white.</p>
1.82 +
1.83 +</body></html>
