layout/reftests/table-overflow/table-cell-block-overflow.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <head>
   4   <meta charset="utf-8">
   5   <title>Test table-cell content overflowing in the block direction for each
   6     vertical-align value</title>
   7   <link rel="author" title="Kyle Zentner" href="mailto:zentner.kyle@gmail.com">
   8   <style>
   9   td {
  10     border: 20px solid teal;
  11     height: 100%;
  12   }
  13   table {
  14     height: 100px;
  15   }
  16   .content {
  17     padding: 20px;
  18     height: 100%;
  19     width:  20px;
  20     background: purple;
  21   }
  22   </style>
  23 </head>
  24   <body>
  25     <table>
  26       <tr>
  27         <td style="vertical-align: middle">
  28           <div class="content"></div>
  29         </td>
  30         <td style="vertical-align: baseline">
  31           <div class="content"></div>
  32         </td>
  33         <td style="vertical-align: bottom">
  34           <div class="content"></div>
  35         </td>
  36         <td style="vertical-align: top">
  37           <div class="content"></div>
  38         </td>
  39       </tr>
  40     </table>
  41   </body>
  42 </html>