backdrop-in-flow.html (802B)
1 <!DOCTYPE html> 2 <link rel="match" href="backdrop-in-flow-ref.html"> 3 <link rel="help" href="https://fullscreen.spec.whatwg.org/#new-stacking-layer"> 4 <style> 5 dialog { 6 visibility: hidden; 7 } 8 9 dialog::backdrop { 10 visibility: visible; 11 height: 100px; 12 width: 50px; 13 } 14 15 #left::backdrop { 16 position: static; 17 top: 100px; 18 left: 100px; 19 background: green; 20 } 21 22 #right::backdrop { 23 position: relative; 24 background: green; 25 top: 100px; 26 left: 150px; 27 } 28 </style> 29 <body> 30 Test that position 'static' or 'relative' for ::backdrop computes to 'absolute'. 31 The test passes if there is a single green box. 32 <dialog id="left"></dialog> 33 <dialog id="right"></dialog> 34 </div> 35 <script> 36 document.querySelector('#left').showModal(); 37 document.querySelector('#right').showModal(); 38 </script> 39 </body>