top-layer-parent-mask.html (687B)
1 <!DOCTYPE html> 2 <html> 3 <title>Test that parent mask does not affect top layer elements</title> 4 <meta charset="utf-8"> 5 <link rel="author" title="Tim Nguyen" href="https://github.com/nt1m"> 6 <link rel="match" href="green-dialog-and-backdrop.html"> 7 <link rel="help" href="https://fullscreen.spec.whatwg.org/#new-stacking-layer"> 8 <style> 9 body { background: red; } 10 11 #parent { 12 mask-image: radial-gradient(black, transparent); 13 mask-size: 100px; 14 } 15 16 dialog::backdrop, 17 dialog { 18 background: green; 19 outline: none; 20 } 21 </style> 22 <body> 23 <div id="parent"> 24 <dialog>PASS if no red shows</dialog> 25 </div> 26 <script> 27 document.querySelector("dialog").showModal(); 28 </script> 29 </body> 30 </html>