tor-browser

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

page-size-008-print.html (2049B)

      1 <!DOCTYPE html>
      2 <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
      3 <link rel="help" href="https://www.w3.org/TR/css-page-3/#at-page-rule">
      4 <link rel="help" href="https://www.w3.org/TR/css-page-3/#using-named-pages">
      5 <link rel="match" href="page-size-008-print-ref.html">
      6 <style>
      7  @page {
      8    size: 200px 160px;
      9    margin: 0;
     10  }
     11  @page smaller {
     12    size: 160px 100px;
     13  }
     14  @page larger {
     15    size: 640px 400px;
     16  }
     17  :root {
     18    print-color-adjust: exact;
     19  }
     20  body {
     21    margin: 0;
     22  }
     23  .container {
     24    display: flow-root;
     25  }
     26  .smaller {
     27    page: smaller;
     28  }
     29  .larger {
     30    page: larger;
     31  }
     32  .float {
     33    float: left;
     34    width: 50px;
     35    height: 80px;
     36  }
     37  .smaller .float {
     38    width: 40px;
     39    height: 50px;
     40  }
     41  .larger .float {
     42    width: 160px;
     43    height: 200px;
     44  }
     45 </style>
     46 <!-- 9 floats should be take us from the start of the current page to the top of
     47     the next page, with the last float placed there. -->
     48 <div class="container larger" style="background:pink;">
     49  <div style="height:0;">first</div>
     50  <div class="float"></div>
     51  <div class="float"></div>
     52  <div class="float"></div>
     53  <div class="float"></div>
     54  <div class="float"></div>
     55  <div class="float"></div>
     56  <div class="float"></div>
     57  <div class="float"></div>
     58  <div class="float"></div>
     59  second
     60 </div>
     61 <div class="container" style="background:yellow;">
     62  <div style="height:0;">third</div>
     63  <div class="float"></div>
     64  <div class="float"></div>
     65  <div class="float"></div>
     66  <div class="float"></div>
     67  <div class="float"></div>
     68  <div class="float"></div>
     69  <div class="float"></div>
     70  <div class="float"></div>
     71  <div class="float"></div>
     72  fourth
     73 </div>
     74 <div class="container smaller" style="background:cyan;">
     75  <div style="height:0;">fifth</div>
     76  <div class="float"></div>
     77  <div class="float"></div>
     78  <div class="float"></div>
     79  <div class="float"></div>
     80  <div class="float"></div>
     81  <div class="float"></div>
     82  <div class="float"></div>
     83  <div class="float"></div>
     84  <div class="float"></div>
     85  sixth
     86 </div>