third_party/WebKit/LayoutTests/fast/block/float/element-clears-float-without-clearance-expected.html

   1 <!DOCTYPE html>
   2 <style>
   3 .bfc {
   4     overflow:hidden;
   5     border:solid;
   6     margin-top:1em;
   7 }
   8
   9 .float {
  10     background-color: aqua;
  11     height: 30px;
  12     display:inline-block;
  13 }
  14
  15 .under {
  16     height: 50px;
  17     background-color: orange;
  18 }
  19
  20 .clear {
  21     margin-top:20px;
  22     height: 50px;
  23     background-color: orange;
  24 }
  25 </style>
  26 crbug.com/434048 : The orange boxes should sit right under the float.
  27 <div class="bfc">
  28     <div class="float">float</div>
  29     <div class="under">clear</div>
  30 </div>
  31
  32 <div class="bfc">
  33     <div class="float">float</div>
  34     <div class="under">clear</div>
  35 </div>
  36
  37 <div class="bfc">
  38     <div class="float">float</div>
  39     <div class="under">clear</div>
  40 </div>
  41
  42 crbug.com/434048 : There should be 30px between the orange box and the float.
  43 <div class="bfc">
  44     <div class="float">float</div>
  45     <div class="clear">clear</div>
  46 </div>
  47
  48 <div class="bfc">
  49     <div class="float">float</div>
  50     <div class="clear">clear</div>
  51 </div>
  52
  53 <div class="bfc">
  54     <div class="float">float</div>
  55     <div class="clear">clear</div>
  56 </div>
  57
  58 <div class="bfc">
  59     <div class="float">float</div>
  60     <div class="clear">clear</div>
  61 </div>
  62
  63 <div class="bfc">
  64     <div class="float">float</div>
  65     <div class="clear">clear</div>
  66 </div>
  67
  68 <div class="bfc">
  69     <div class="float">float</div>
  70     <div class="clear">clear</div>
  71 </div>
  72