| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- This tests that top layer elements are rendered above z-indexed elements | 2 <!-- This tests that top layer elements are rendered above z-indexed elements |
| 3 and stacked in the correct order amongst themselves. Also, layer features like | 3 and stacked in the correct order amongst themselves. Also, layer features like |
| 4 transforms and z-index are tested inside a top layer element subtree. --> | 4 transforms and z-index are tested inside a top layer element subtree. --> |
| 5 <html> | 5 <html> |
| 6 <head> | 6 <head> |
| 7 <style> | 7 <style> |
| 8 .box { | 8 .box { |
| 9 height:150px; | 9 height:150px; |
| 10 width:150px; | 10 width:150px; |
| 11 } | 11 } |
| 12 |
| 13 ::backdrop { |
| 14 display: none; |
| 15 } |
| 16 |
| 12 .container { | 17 .container { |
| 13 -webkit-perspective: 500px; | 18 -webkit-perspective: 500px; |
| 14 border: 1px solid black; | 19 border: 1px solid black; |
| 15 background-color: magenta; | 20 background-color: magenta; |
| 16 } | 21 } |
| 17 .transformed { | 22 .transformed { |
| 18 -webkit-transform: rotateY(45deg); | 23 -webkit-transform: rotateY(45deg); |
| 19 background-color: cyan; | 24 background-color: cyan; |
| 20 } | 25 } |
| 21 </style> | 26 </style> |
| (...skipping 18 matching lines...) Expand all Loading... |
| 40 </div> | 45 </div> |
| 41 <div style="position: absolute; top: 100px; left: 0px; right: 0px; height: 200em
; background-color: yellow; z-index:1000"> | 46 <div style="position: absolute; top: 100px; left: 0px; right: 0px; height: 200em
; background-color: yellow; z-index:1000"> |
| 42 </div> | 47 </div> |
| 43 <script> | 48 <script> |
| 44 document.getElementById('bottomDialog').showModal(); | 49 document.getElementById('bottomDialog').showModal(); |
| 45 document.getElementById('topDialog').showModal(); | 50 document.getElementById('topDialog').showModal(); |
| 46 document.getElementById('hiddenDialog').showModal(); | 51 document.getElementById('hiddenDialog').showModal(); |
| 47 </script> | 52 </script> |
| 48 </body> | 53 </body> |
| 49 </html> | 54 </html> |
| OLD | NEW |