third_party/WebKit/LayoutTests/fast/writing-mode/table-percent-width-quirk.html

   1 <style>
   2 * {
   3     font-size: 16px;
   4     font-family: Times;
   5     padding: 0;
   6     border-spacing: 0;
   7     line-height: 10px;
   8 }
   9 .vertical {
  10     -webkit-writing-mode: vertical-rl;
  11     writing-mode: tb-rl;
  12 }
  13 .horizontal {
  14      -webkit-writing-mode: horizontal-tb;
  15      writing-mode: lr-tb;
  16 }
  17 .container {
  18     width: 100px;
  19     height: 50px;
  20     position: absolute;
  21     background-color: grey;
  22 }
  23 .positioned-child {
  24     position: absolute;
  25     background-color: blue;
  26 }
  27 .leaf {
  28     background-color: green;
  29 }
  30 .content {
  31     height: 20px;
  32     width: 20px;
  33 }
  34 </style>
  35 <!-- Each pair of cases below should render the same. -->
  36 <div class="container" style="top: 50px">
  37     <div class="positioned-child"><div class="content"></div><div class="leaf" style="width: 100%;"><div class="content"></div></div></div>
  38 </div>
  39 <div class="container" style="top: 125px">
  40     <div class="positioned-child"><div class="content"></div><table class="leaf" style="width: 100%;"><tr><td><div class="content"></div></table></div>
  41 </div>
  42 <div class="container vertical" style="top: 200px">
  43     <div class="positioned-child"><div class="content"></div><table class="leaf" style="height: 100%;"><tr><td><div class="content"></div></table></div>
  44 </div>
  45 <div class="container vertical" style="top: 275px">
  46     <div class="positioned-child"><div class="content"></div><div class="leaf" style="height: 100%;"><div class="content"></div></div></div>
  47 </div>
  48 <div class="container vertical" style="top: 350px">
  49     <div class="positioned-child"><div class="content"></div><table class="leaf horizontal" style="width: 100%;"><tr><td><div class="content"></div></table></div>
  50 </div>
  51 <div class="container vertical" style="top: 425px">
  52     <div class="positioned-child"><div class="content"></div><div class="leaf horizontal" style="width: 100%;"><div class="content"></div></div></div>
  53 </div>