tor-browser

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

absolute.https.html (1586B)

      1 <!DOCTYPE html>
      2 <html class=reftest-wait>
      3 <link rel="help" href="https://drafts.css-houdini.org/css-layout-api/#interaction-sizing">
      4 <link rel="match" href="absolute-ref.html">
      5 <meta name="assert" content="This test checks that the absolute positioning respects the intrinsicSizes function." />
      6 
      7 <style>
      8 .test {
      9  background: red;
     10  position: absolute;
     11 }
     12 
     13 @supports (display: layout(test-layout)) {
     14  .test {
     15    display: layout(test-layout);
     16    background: green;
     17  }
     18 }
     19 
     20 .container-1 {
     21  border: solid 2px;
     22  position: relative;
     23  height: 200px;
     24  width: 300px;
     25 }
     26 
     27 .container-2 {
     28  border: solid 2px;
     29  position: relative;
     30  height: 25px;
     31  width: 25px;
     32 }
     33 
     34 .horizontal {
     35  writing-mode: horizontal-tb;
     36 }
     37 
     38 .vertical {
     39  writing-mode: vertical-rl;
     40 }
     41 
     42 </style>
     43 <script src="/common/reftest-wait.js"></script>
     44 <script src="/common/worklet-reftest.js"></script>
     45 
     46 
     47 <div class="container-1">
     48  <div class="horizontal test" style="height: 100px; bottom: 0px;"></div>
     49  <div class="vertical test" style="width: 100px; right: 0px;"></div>
     50 </div>
     51 
     52 <div class="container-2">
     53  <div class="horizontal test" style="height: 25px; bottom: 0px;"></div>
     54 </div>
     55 
     56 <div class="container-2">
     57  <div class="vertical test" style="width: 25px; right: 0px;"></div>
     58 </div>
     59 
     60 
     61 <script id="code" type="text/worklet">
     62 registerLayout('test-layout', class {
     63  async intrinsicSizes() {
     64    return { maxContentSize: 100, minContentSize: 50 };
     65  }
     66  async layout() {}
     67 });
     68 </script>
     69 
     70 <script>
     71 importWorkletAndTerminateTestAfterAsyncPaint(CSS.layoutWorklet, document.getElementById('code').textContent);
     72 </script>
     73 </html>