mix-blend-mode-overflowing-child-ref.html (1335B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Reftest Reference</title> 5 <link rel="author" title="Mihai Tica" href="mailto:mitica@adobe.com"> 6 <link rel="reviewer" title="Mihai Balan" href="mailto:mibalan@adobe.com"> 7 <link rel="reviewer" title="Horia Olaru" href="mailto:olaru@adobe.com"> 8 <style type="text/css"> 9 body { 10 background: lightgray; 11 } 12 .container { 13 position: absolute; 14 z-index: 1; 15 width: 100px; 16 height: 100px; 17 background: #0F0; 18 } 19 .blender { 20 background: #0F0; 21 margin: 50px; 22 width: 100px; 23 height: 100px; 24 } 25 .intersection { 26 background: #000; 27 width: 50px; 28 height: 50px; 29 margin-top: -150px; 30 margin-left: 50px; 31 } 32 </style> 33 </head> 34 <body> 35 <p>Test passes if you can see two green squares and a black square as their intersection,<br> 36 drawn over a light gray background.</p> 37 <div class="container"> 38 <div class="blender"></div> 39 <div class="intersection"></div> 40 </div> 41 </body> 42 </html>