layout/reftests/bugs/379349-1c.xhtml

   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">
   3  <head>
   4   <title>CSS3 Multi-column Layout Test Suite: Overflow Pagination (Multiple)</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     .container {
  10       height: 24pt;
  11       background: red;
  12     }
  13     .overflow {
  14       height: 5in;
  15       border: 2pt silver solid;
  16       border-top: none;
  17       border-bottom: solid 10px red;
  18     }
  19     #following {
  20       margin: -72pt 0;
  21       height: 72pt;
  22       background: white;
  23       border: 2pt black;
  24       border-style: none solid;
  25
  26       font-size: 10pt;
  27       line-height: 10pt;
  28       color: blue;
  29     }
  30     .no2 .overflow {
  31       height: 4.66667in;
  32       border-bottom-color: blue;
  33     }
  34     .no3 .overflow {
  35       height: 4.33333in;
  36       position: relative;
  37       z-index: -1;
  38     }
  39     body {
  40       height: 2in;
  41       width: 300pt;
  42       column-width: 100pt;
  43       column-gap: 0;
  44       border: solid gray;
  45     }
  46   </style>
  47  </head>
  48  <body>
  49   <div class="container no1">
  50     <div class="overflow">
  51     </div>
  52   </div>
  53   <div class="container no2">
  54     <div class="overflow">
  55     </div>
  56   </div>
  57   <div class="container no3">
  58     <div class="overflow">
  59     </div>
  60   </div>
  61   <p id="following">
  62     This paragraph must be in the first column.
  63     There must be no red. There must be a blue
  64     horizontal line in middle of the third
  65     column.
  66   </p>
  67  </body>
  68 </html>