tor-browser

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

supports-rule.html (1074B)

      1 <!DOCTYPE html>
      2 <title>@supports with nesting</title>
      3 <link rel="author" title="Matthieu Dubet" href="mailto:m_dubet@apple.com">
      4 <link rel="help" href="https://drafts.csswg.org/css-nesting-1/">
      5 <link rel="match" href="supports-rule-ref.html">
      6 <style>
      7  .test {
      8    background-color: red;
      9    width: 100px;
     10    height: 100px;
     11    display: grid;
     12  }
     13 
     14  @supports(not selector(> .test-1)) {
     15    .test-1 {
     16      background-color: green;
     17    }
     18  }
     19 
     20  .test {
     21    > .test-2 {
     22      background-color: green;
     23    }
     24    @supports (selector(> .test-2)) {
     25      > .test-2 {
     26        background-color: red;
     27      }
     28    }
     29  }
     30 
     31  .test-3 {
     32    @supports (selector(&)) {
     33      & {
     34        background-color: green;
     35      }
     36    }
     37  }
     38 
     39  @supports(selector(&)) {
     40    .test-4 {
     41      background-color: green;
     42    }
     43  }
     44 
     45  body * + * {
     46    margin-top: 8px;
     47  }
     48 </style>
     49 <body>
     50  <p>Tests pass if <strong>block is green</strong></p>
     51  <div class="test test-1"></div>
     52  <div class="test"><div class="test-2"></div></div>
     53  <div class="test test-3"></div>
     54  <div class="test test-4"></div>
     55 </body>