third_party/WebKit/LayoutTests/fast/writing-mode/logical-height-after-clear.html

   1 <style>
   2     div.test {
   3         -webkit-logical-width: 50px;
   4         -webkit-logical-height: 100px;
   5         background-color: red;
   6     }
   7
   8     div.float {
   9         float: left;
  10         -webkit-logical-height: 50px;
  11         -webkit-logical-width: 50px;
  12         background-color: blue;
  13     }
  14
  15     div.clear {
  16         clear: left;
  17     }
  18
  19     div.green {
  20         background-color: green;
  21         -webkit-logical-height: 25px;
  22     }
  23
  24     div.lr {
  25         -webkit-writing-mode: vertical-lr;
  26     }
  27
  28     div.rl {
  29         -webkit-writing-mode: vertical-rl;
  30     }
  31 </style>
  32 <div class="test lr">
  33     <div class="float"></div>
  34     <div class="clear"></div>
  35     <div class="green"></div>
  36     <div class="green"></div>
  37 </div>
  38
  39 <div class="test lr">
  40     <div class="float"></div>
  41     <div class="clear green"></div>
  42     <div class="green"></div>
  43 </div>
  44
  45 <div class="test rl">
  46     <div class="float"></div>
  47     <div class="clear"></div>
  48     <div class="green"></div>
  49     <div class="green"></div>
  50 </div>
  51
  52 <div class="test rl">
  53     <div class="float"></div>
  54     <div class="clear green"></div>
  55     <div class="green"></div>
  56 </div>