third_party/WebKit/LayoutTests/fast/block/float/floats-offset-image-quirk.html

   1 <html>
   2 <head>
   3     <style>
   4         body { width: 400px;}
   5         .container { width: 100px; height: 150px; position: relative;}
   6         div { background: white; }
   7         img { background: red; width: 20px; height: 20px; }
   8         .narrowfloat { float: left; width: 10px; height: 25px;}
   9         .widefloat { float: left; clear: left; width: 40px; height: 5px;}
  10         .reference { position: absolute; width: 20px; height: 20px; background: black; }
  11         .first { left: 10px; }
  12         .second { left: 40px; top: 20px; }
  13     </style>
  14 </head>
  15 <body>
  16 <!-- In quirks mode, images have their descent removed so that they squeeze together across line breaks.
  17      Ensure the images find the correct offset for their line when avoiding floats. -->
  18 There should be no red visible below.
  19 <div class="container">
  20     <div class="narrowfloat"></div>
  21     <div class="widefloat"></div>
  22     <!-- This should cover the first image. -->
  23     <div class="reference first"></div>
  24     <!-- This should cover the second image. -->
  25     <div class="reference second"></div>
  26     <img><br><img>
  27 </div>
  28
  29
  30 </body></html>