<style>
    table { border-collapse: collapse; }
    td { border: 1px solid #000000; }
</style>
<script src="../../resources/check-layout.js"></script>
<body onload="checkLayout('tr')">
    <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/detail?id=396655">396655</a>. Tables with specific merge cell configuration render with extra height to tr elements.</h4>
    <p>We have the below table. Because cell A and cell D overlap in the second row, the height of the second row is the 1px difference between A and B and the 1px difference between C and D.</p>
    <pre>+-----+-----+</pre>
    <pre>|     |  B  |</pre>
    <pre>|  A  +-----+</pre>
    <pre>|     |     |</pre>
    <pre>+-----+  D  |</pre>
    <pre>|  C  |     |</pre>
    <pre>+-----+-----+</pre>
    <table style="width: 624px;">
        <tbody>
            <tr data-expected-height="32">
                <td rowspan="2" style="height: 33px;"></td>
                <td style="height: 32px;"></td>
            </tr>
            <tr data-expected-height="1">
                <td rowspan="2" style="height: 33px;"></td>
            </tr>
            <tr data-expected-height="32">
                <td style="height: 32px;"></td>
            </tr>
        </tbody>
    </table>
</body>