The Tor Browser: layout/reftests/pagination/abspos-overflow-01.xhtml@fc2d59ddac77

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

     2 <html xmlns="http://www.w3.org/1999/xhtml" class="reftest-print">

     3  <head>

     4   <title>Multi-column Layout: AbsPos Pagination (Interlaced)</title>

     5   <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/>

     6   <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#the-height-property"/>

     7   <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#length-units"/>

     8   <style type="text/css">

     9     /* If the reftest print size change, this needs to change too. */

    10     html, body {

    11       margin: 0;

    12       padding: 0;

    13     }

    15     .container {

    16       background: red;

    17       height: 24pt;

    18       position: relative;

    19     }

    20     .overflow {

    21       width: 10pt;

    22       border-bottom: lime 4px solid;

    23       top: 0;

    24     }

    25     .following {

    26       font-size: 10pt;

    27       line-height: 10pt;

    28       font-family: sans-serif;

    29       text-align: center;

    30       position: relative;

    31       background: white;

    32       width: 100pt;

    33     }

    34     #pageset {

    35       width: 100pt;

    36       border: silver 2pt;

    37       border-style: none solid;

    38       height: 6in;

    39     }

    40     .redline {

    41       float: left;

    42       margin-right: -103pt;

    43       width: 103pt;

    44       border-bottom: 8px solid red;

    45       position: relative;

    46       z-index: -1;

    47     }

    48     .r1 {

    49       height: 50%;

    50     }

    51     .r2 {

    52       height: 150%;

    53     }

    54     .r3 {

    55       height: 250%;

    56     }

    58     .ocontainer {

    59       height: 0;

    60     }

    61     .o1 { /* 3rd page */

    62       height: 5in;

    63     }

    64     .a1 { /* 1st page */

    65       position: absolute;

    66       height: 1in;

    67       width: 33pt;

    68     }

    69     .a2 { /* 2nd page */

    70       position: absolute;

    71       height: 3in;

    72       width: 25pt;

    73       margin-left: 25pt;

    74     }

    75     .a3 { /* 3rd page */

    76       position: absolute;

    77       height: 5in;

    78       margin-left: 10pt;

    79     }

    80     .a4 { /* 2nd page */

    81       width: 25pt;

    82       height: 3in;

    83     }

    85     .b1 { /* 3rd page */

    86       position: absolute;

    87       height: 336pt;

    88       margin-left: 20pt;

    89     }

    90     .b2 { /* 2nd page */

    91       position: absolute;

    92       height: 192pt;

    93       width: 25pt;

    94       margin-left: 50pt;

    95     }

    96     .b3 { /* 3rd page */

    97       position: absolute;

    98       height: 336pt;

    99       margin-left: 30pt;

   100     }

   101     .b4 { /* 1st col, but no border */

   102       position: absolute;

   103       height: 48pt;

   104       border-bottom: none;

   105     }

   106     .b4 .child1 { /* 1st page */

   107       position: absolute;

   108       height: 100%;

   109       width: 33pt;

   110       margin-left: 33pt;

   111     }

   112     .b4 .child2 { /* 3rd page */

   113       height: 336pt;

   114       margin-left: 40pt;

   116     }

   117     .b5 { /* 1st page */

   118       position: absolute;

   119       height: 48pt;

   120       width: 34pt;

   121       margin-left: 66pt;

   122     }

   123     .b6 { /* 3rd page */

   124       height: 336pt;

   125       margin-left: 50pt;

   126     }

   128     .c1 { /* 3rd page */

   129       position: absolute;

   130       height: 3in;

   131       margin-left: 60pt;

   132     }

   133     .c2 { /* 2nd page */

   134       position: absolute;

   135       height: 1in;

   136       width: 25pt;

   137       margin-left: 75pt;

   138     }

   139     .c3 { /* 3rd page */

   140       position: absolute;

   141       height: 3in;

   142       margin-left: 70pt;

   143     }

   144     .c4 { /* 3rd page */

   145       height: 3in;

   146       width: 20pt;

   147       margin-left: 80pt;

   148     }

   150     .f1 {

   151       margin-top: -48pt;

   152       height: 48pt;

   153       margin-bottom: 96pt;

   154     }

   155     .f2 {

   156       margin-top: -24pt;

   157       height: 24pt;

   158     }

   159   </style>

   160  </head>

   161  <body>

   162   <div class="redline r1"></div>

   163   <div class="redline r2"></div>

   164   <div class="redline r3"></div>

   166   <div id="pageset">

   167     <div>

   168       <div class="ocontainer">

   169         <div class="overflow o1"></div>

   170       </div>

   171       <div class="container">

   172         <div class="overflow a1"></div>

   173         <div class="overflow a2"></div>

   174         <div class="overflow a3"></div>

   175         <div class="overflow a4"></div>

   176       </div>

   177       <div class="container">

   178         <div class="overflow b1"></div>

   179         <div class="overflow b2"></div>

   180         <div class="overflow b3"></div>

   181         <div class="overflow b4">

   182           <div class="overflow child1"></div>

   183           <div class="overflow child2"></div>

   184         </div>

   185         <div class="overflow b5"></div>

   186         <div class="overflow b6"></div>

   187       </div>

   188     </div>

   189     <p class="following f1">

   190       There must be 3 pages, a single green line on each page, and no red.

   191     </p>

   192     <div class="container">

   193       <div class="overflow c1"></div>

   194       <div class="overflow c2"></div>

   195       <div class="overflow c3"></div>

   196       <div class="overflow c4"></div>

   197     </div>

   198     <div class="following f2"></div>

   199   </div>

   200  </body>

   201 </html>

The Tor Browser / file revision