LayoutTests/css2.1/t090501-c414-flt-ln-02-d.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
   2 <html>
   3  <head>
   4   <title>CSS 2.1 Test Suite: Floating Elements</title>
   5   <style type="text/css">
   6    p { color: navy; }
   7    div { border: 5px solid purple; padding: 1em; margin: 1em; color: silver; font: 1em/1.3 serif; }
   8    div p { width: 7em; padding: 1em; margin: 0; }
   9    div .a { border: solid aqua; background-color: teal; color: white; }
  10    div p.a { float: left; }
  11    div .b { border: solid fuchsia; background-color: purple; color: white; }
  12    div p.b { float: right; }
  13    div .c { border: solid yellow; background-color: orange; color: white; }
  14    div p.c { float: left; }
  15    div .d { border: solid lime; background-color: green; color: white; }
  16    div p.d { float: left; }
  17   </style>
  18   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#float-position" title="9.5.1 Positioning the float: the 'float' property">
  19  </head>
  20  <body>
  21   <p>The big coloured boxes should be level with the top of the small
  22   coloured boxes of the same color (unless there is not enough room
  23   for the big box to fit on the small box's line after the small box,
  24   in which case the big box should be as high as possible below the
  25   small box).</p>
  26   <div>
  27    dummy text dummy text dummy text dummy text dummy text dummy text
  28    dummy text
  29    <span class="a">A</span>
  30    <p class="a">AAAA</p>
  31    dummy text dummy text dummy text dummy text dummy text dummy text
  32    <span class="b">B</span>
  33    <p class="b">BBBB</p>
  34    dummy text dummy text dummy text
  35    <span class="c">C</span>
  36    <p class="c">CCCC</p>
  37    dummy text dummy text dummy text dummy text dummy text dummy text
  38    <span class="d">D</span>
  39    <p class="d">DDDD</p>
  40    dummy text dummy text dummy text dummy text dummy text dummy text
  41    dummy text dummy text dummy text dummy text dummy text dummy text
  42    dummy text dummy text dummy text dummy text dummy text dummy text
  43    dummy text dummy text dummy text dummy text dummy text dummy text
  44    dummy text dummy text dummy text dummy text dummy text dummy text
  45    dummy text dummy text dummy text dummy text dummy text dummy text
  46    dummy text dummy text dummy text dummy text dummy text dummy text
  47    dummy text dummy text dummy text dummy text dummy text dummy text
  48    dummy text dummy text dummy text dummy text dummy text dummy text
  49    dummy text dummy text dummy text dummy text dummy text dummy text
  50    dummy text dummy text dummy text dummy text dummy text dummy text
  51    dummy text dummy text dummy text dummy text dummy text dummy text
  52    dummy text dummy text dummy text dummy text dummy text dummy text
  53    dummy text dummy text dummy text dummy text dummy text dummy text
  54    dummy text dummy text dummy text dummy text dummy text dummy text
  55    dummy text dummy text dummy text dummy text dummy text dummy text
  56    dummy text dummy text dummy text dummy text dummy text dummy text
  57    dummy text dummy text dummy text dummy text dummy text dummy text
  58    dummy text dummy text dummy text dummy text dummy text dummy text
  59    dummy text dummy text dummy text dummy text dummy text dummy text
  60   </div>
  61  </body>
  62 </html>