| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <style> | 2 <style> |
| 3 #dialog { | 3 #dialog { |
| 4 position: absolute; | 4 position: absolute; |
| 5 top: 100px; | 5 top: 100px; |
| 6 left: 100px; | 6 left: 100px; |
| 7 height: 100px; | 7 height: 100px; |
| 8 width: 100px; | 8 width: 100px; |
| 9 background: green; | 9 background: green; |
| 10 } | 10 } |
| (...skipping 22 matching lines...) Expand all Loading... |
| 33 if there are two green boxes, one with the texts "::before" and "::after" in it. | 33 if there are two green boxes, one with the texts "::before" and "::after" in it. |
| 34 <div id="dialog"> | 34 <div id="dialog"> |
| 35 <div id="dialog-before">::before</div> | 35 <div id="dialog-before">::before</div> |
| 36 <div id="dialog-after">::after</div> | 36 <div id="dialog-after">::after</div> |
| 37 </div> | 37 </div> |
| 38 <div id="dialog-backdrop"></div> | 38 <div id="dialog-backdrop"></div> |
| 39 <script> | 39 <script> |
| 40 document.querySelector('dialog').showModal(); | 40 document.querySelector('dialog').showModal(); |
| 41 </script> | 41 </script> |
| 42 </body> | 42 </body> |
| OLD | NEW |