modal-dialog-backdrop-ref.html (785B)
1 <!DOCTYPE html> 2 <style> 3 .dialog-default-ua-style { 4 position: absolute; 5 overflow: auto; 6 top: 0; 7 right: 0; 8 bottom: 0; 9 left: 0; 10 margin: auto; 11 border: solid; 12 padding: 1em; 13 background: white; 14 color: black; 15 } 16 17 #dialog { 18 margin: auto; 19 height: 100px; 20 width: 100px; 21 top: 100px; 22 z-index: 1000; 23 background: green; 24 } 25 26 #backdrop { 27 position: fixed; 28 top: 0; 29 left: 0; 30 right: 0; 31 bottom: 0; 32 background: rgba(0,0,0,0.1); 33 z-index: 100; 34 } 35 </style> 36 <body> 37 Test for the default user agent style of dialog::backdrop. The test passes if 38 there is a green box, above a very lightly translucent gray box spanning the 39 viewport. 40 <div id="backdrop"></div> 41 <div class="dialog-default-ua-style" id="dialog"></div> 42 </body>