third_party/WebKit/LayoutTests/fast/css/inline-table-first-row-empty-cell-non-auto.html

   1 <!DOCTYPE html>
   2 <style>
   3 body {
   4     margin: 0;
   5     padding: 0;
   6 }
   7 table {
   8     padding: 0;
   9     border: 0;
  10     border-spacing: 0;
  11     display: inline-table;
  12     background-color: black;
  13 }
  14 span {
  15    font: 50px Ahem;
  16    line-height: 80px;
  17 }
  18 td {
  19     border: 0px;
  20     padding: 10px;
  21     height: 20px;
  22 }
  23 </style>
  24 <script src="../../resources/check-layout.js"></script>
  25 <span data-total-y=15>
  26     Text
  27     <table data-total-y=35>
  28         <tr><td></td></tr>
  29     </table>
  30     Text
  31 </span>
  32 <p>crbug.com/452593: If an inline-table consists of a single row which consists of a single empty cell, then the
  33    baseline of the inline-table coincides with the baseline of the row  which coincides with the bottom content edge of the cell.
  34    The black boxes on the left and right  will align together along their bottom edges. The one in the middle will be halfway
  35    down vertically between the two.
  36    </p>
  37    <p id="test-output"></p>
  38 <script>
  39 checkLayout('table', document.getElementById("test-output"));
  40 checkLayout('span', document.getElementById("test-output"));
  41 </script>