layout/reftests/bugs/860242-1.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <meta charset="utf-8">
   5     <style>
   6       .table {
   7         display: table;
   8         width: 100px;
   9         table-layout: fixed;
  10         margin-bottom: 2px;
  11       }
  12
  13       .table > * {
  14         box-sizing: border-box;
  15         display: table-cell;
  16         height: 30px;
  17       }
  18
  19       .withPadding { padding: 10px; }
  20       .withBorder  { border: 2px solid black; }
  21
  22       .thin { width: 25%; }
  23       .wide { width: 75%; }
  24
  25       .teal    { background: teal; }
  26       .purple  { background: purple; }
  27     </style>
  28   </head>
  29   <body>
  30     <div class="table">
  31       <div class="thin teal"></div>
  32       <div class="wide purple"></div>
  33     </div>
  34     <div class="table">
  35       <div class="thin withPadding teal"></div>
  36       <div class="wide withPadding purple"></div>
  37     </div>
  38     <div class="table">
  39       <div class="thin withBorder teal"></div>
  40       <div class="wide withBorder purple"></div>
  41     </div>
  42     <div class="table">
  43       <div class="thin withBorder withPadding teal"></div>
  44       <div class="wide withBorder withPadding purple"></div>
  45     </div>
  46   </body>
  47 </html>