tor-browser

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

anchor-scroll-fixedpos-003.html (879B)


      1 <!DOCTYPE html>
      2 
      3 <title>Tests that fixed-positioned anchor-positioned elements doesn't get clipped by the viewport</title>
      4 <link rel="author" href="mailto:kiet.ho@apple.com">
      5 <link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/">
      6 <link rel="match" href="reference/anchor-scroll-fixedpos-003-ref.html">
      7 
      8 <style>
      9  body {
     10    margin: 0;
     11  }
     12 
     13  div {
     14    width: 100px;
     15    height: 100px;
     16    font-size: 16px;
     17  }
     18 
     19  #anchor {
     20    anchor-name: --a1;
     21    margin-top: 105vh;
     22    background: orange;
     23  }
     24 
     25  #anchored {
     26    position: fixed;
     27    position-anchor: --a1;
     28    left: anchor(left);
     29    bottom: anchor(top);
     30    background: green;
     31    color: white;
     32  }
     33 </style>
     34 
     35 <body>
     36  <div id="anchor"></div>
     37  <div id="anchored">Anchored element</div>
     38 
     39  <script>
     40    const anchor = document.getElementById("anchor");
     41    anchor.scrollIntoView(false);
     42  </script>
     43 </body>