tor-browser

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

conditional-rules.html (1374B)

      1 <!DOCTYPE html>
      2 <title>Conditional rules with nesting</title>
      3 <link rel="author" title="Adam Argyle" href="mailto:argyle@google.com">
      4 <link rel="help" href="https://drafts.csswg.org/css-nesting-1/">
      5 <link rel="match" href="conditional-rules-ref.html">
      6 <style>
      7  .test {
      8    background-color: red;
      9    width: 30px;
     10    height: 30px;
     11    display: grid;
     12  }
     13 
     14  .test-5 {
     15    @media (min-width: 10px) {
     16      & {
     17        background-color: green;
     18      }
     19    }
     20  }
     21 
     22  .test-6 {
     23    @media (min-width: 10px) {
     24      background-color: green;
     25    }
     26  }
     27 
     28  .test-10 {
     29    @supports (display: grid) {
     30      & {
     31        background-color: green;
     32      }
     33    }
     34  }
     35 
     36  .test-11 {
     37    @layer {
     38      & {
     39        background-color: green !important;
     40      }
     41    }
     42  }
     43 
     44  .test-12 {
     45    @scope (&) {
     46      :scope {
     47        background-color: green;
     48      }
     49    }
     50  }
     51 
     52  div {
     53    container-type: inline-size;
     54  }
     55  .test-13 {
     56    @container (width >= 0px) {
     57      & {
     58        background-color: green;
     59      }
     60    }
     61  }
     62 
     63  body * + * {
     64    margin-top: 8px;
     65  }
     66 </style>
     67 <body>
     68  <p>Tests pass if <strong>block is green</strong></p>
     69  <div class="test test-5"></div>
     70  <div class="test test-6"></div>
     71  <div class="test test-10"></div>
     72  <div class="test test-11"></div>
     73  <div class="test test-12"><div class="test-12"></div></div>
     74  <div class="test"><div class="test-13"></div></div>
     75 </body>