Thu, 15 Jan 2015 15:55:04 +0100
Back out 97036ab72558 which inappropriately compared turds to third parties.
1 <!DOCTYPE HTML>
2 <head>
3 <style>
4 .parent {
5 width: 200px;
6 height: 200px;
7 overflow: hidden;
8 border-radius: 0px 0px 20px 0px;
9 position: absolute;
10 z-index: 0;
11 background-color: #00ff00;
12 }
14 .child {
15 width: 300px;
16 height: 300px;
17 margin-left: 100px;
18 background-color: #ff0000;
19 mix-blend-mode: difference;
20 }
22 body {
23 margin: 0;
24 }
26 </style>
27 <!-- Rounded rect clipping seems to not yield the same results when clipping
28 the parent and child elements individually. The reference rendering will show
29 some of the parent green color around the child's clipped corner.
30 The reftests, on the other hand, shows some gray pixels around the same area.
31 This may somehow be related to antialiasing. -->
32 </head>
33 <body>
34 <div class="parent">
35 <div class="child"></div>
36 </div>
37 </body>