tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

dialog-backdrop-create.html (749B)

      1 <!doctype html>
      2 <title>CSS Container Queries Test: ::backdrop appearing conditionally on dialog container</title>
      3 <link rel="help" href="https://drafts.csswg.org/css-conditional-5/#container-queries">
      4 <link rel="match" href="top-layer-dialog-backdrop-ref.html">
      5 <style>
      6  html {
      7    /* Prevent multiple layout passes due to scrollbars */
      8    overflow: hidden;
      9    background: red;
     10  }
     11  dialog {
     12    container-type: size;
     13    width: 100px;
     14    height: 100px;
     15    visibility: hidden;
     16  }
     17  dialog::backdrop {
     18    visibility: visible;
     19    display: none;
     20    background-color: green;
     21  }
     22  @container (width > 1px) {
     23    dialog::backdrop {
     24      display: block;
     25    }
     26  }
     27 </style>
     28 <dialog id="dialog"></dialog>
     29 <script>
     30  dialog.showModal();
     31 </script>