third_party/WebKit/LayoutTests/fast/multicol/float-edge.html

   1 <!DOCTYPE html>
   2 <style>
   3     .multicol {
   4         width: 480px;
   5         height: 200px;
   6         border: 3px solid black;
   7         -webkit-column-gap: 0;
   8         -webkit-column-count: 3;
   9         line-height: 20px;
  10     }
  11     .float {
  12         padding: 10px;
  13         background-color: skyblue;
  14     }
  15     .left { float: left; }
  16     .right { float: right; }
  17 </style>
  18
  19 <p>There should be two blue floats in each of the three columns below, L's should float to the left,
  20    and R's should float to the right.</p>
  21 <div class="multicol">
  22     First<br>
  23     First<br>
  24     First<br>
  25     First<br>
  26     <div class="float left">L1</div>
  27     <div class="float right">R1</div>
  28     First<br>
  29     First<br>
  30     First<br>
  31     First<br>
  32     First<br>
  33     First<br>
  34
  35     <div class="float left">L2</div>
  36     <div class="float right">R2</div>
  37     Second<br>
  38     Second<br>
  39     Second<br>
  40     Second<br>
  41     Second<br>
  42     Second<br>
  43     Second<br>
  44     Second<br>
  45     Second<br>
  46     Second<br>
  47
  48     Third<br>
  49     Third<br>
  50     Third<br>
  51     Third<br>
  52     Third<br>
  53     Third<br>
  54     Third<br>
  55     Third<br>
  56     <div class="float left">L3</div>
  57     <div class="float right">R3</div>
  58     Third<br>
  59     Third<br>
  60 </div>