LayoutTests/css2.1/t0905-c5525-fltmult-00-d-g.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
   2 <html>
   3  <head>
   4   <title>CSS 2.1 Test Suite: float</title>
   5   <style type="text/css">
   6    .a { color: navy; }
   7    div.yellow, div.blue, div.red, div.green {
   8     width: 60px; padding: 20px; margin: 10px;
   9     border: 20px solid black; float: left; text-align: center;
  10    }
  11    div.yellow {margin-left: 0px; background: yellow; color: black;}
  12    div.blue {background: blue; color: white;}
  13    div.red {background: red; color: black;}
  14    div.green {background: green; color: white;}
  15    div.below {clear: both;}
  16    table {margin: 10px 0px;}
  17   </style>
  18   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" title="9.5 Floats">
  19   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#float-position" title="9.5.1 Positioning the float: the 'float' property">
  20  </head>
  21  <body>
  22   <p class="a">
  23    Below you should see four blocks side by side followed by a
  24    matching cross section of the four blocks.
  25   </p>
  26   <div class="yellow">
  27    <p>
  28     Yellow
  29    </p>
  30   </div>
  31   <div class="blue">
  32    <p>
  33     Blue
  34    </p>
  35   </div>
  36   <div class="red">
  37    <p>
  38     Red
  39    </p>
  40   </div>
  41   <div class="green">
  42    <p>
  43     Green
  44    </p>
  45   </div>
  46   <div class="below">
  47    <table cellspacing="0" cellpadding="0">
  48     <tr>
  49      <td width="20" style="background: black">
  50
  51      </td>
  52      <td width="100" style="background: yellow">
  53
  54      </td>
  55      <td width="20" style="background: black">
  56
  57      </td>
  58      <td width="20" style="background: white">
  59
  60      </td>
  61      <td width="20" style="background: black">
  62
  63      </td>
  64      <td width="100" style="background: blue">
  65
  66      </td>
  67      <td width="20" style="background: black">
  68
  69      </td>
  70      <td width="20" style="background: white">
  71
  72      </td>
  73      <td width="20" style="background: black">
  74
  75      </td>
  76      <td width="100" style="background: red">
  77
  78      </td>
  79      <td width="20" style="background: black">
  80
  81      </td>
  82      <td width="20" style="background: white">
  83
  84      </td>
  85      <td width="20" style="background: black">
  86
  87      </td>
  88      <td width="100" style="background: green">
  89
  90      </td>
  91      <td width="20" style="background: black">
  92
  93      </td>
  94     </tr>
  95    </table>
  96   </div>
  97  </body>
  98 </html>