固定 TD 高度与混合中的行距

Question

桌子不适合我。

这是我正在使用的表格的简化版本： http://jsfiddle.net/bWghU/

代码如下：

table {
    padding: 5px;   
}
table th { padding: 0 5px }
table tr { background-color: #CCC }
table tr:nth-child(odd) { background-color: #FFF }
table td { border-bottom: 1px solid #555 }

<table>
    <thead>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
    </thead>
    <tbody>
        <tr>
            <td rowspan="10" style="background-color:red">this has a <br /><br /><br />min-height of ~100px<br /><br /><br /></td>
            <td>one</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td rowspan="2" style="background-color:blue">this has a <br /><br /><br />min-height of ~100px<br /><br /><br /></td>
            <td>one</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
    </tbody>
</table>

正如你所看到的，行跨度扼杀了我固定高度的梦想。我尝试过（动态地）将 div 包裹在里面，但没有成功。

我需要 TD 保持相同的高度，除了带有行跨的高度（它需要根据需要扩展） - 这样 TD 就不会拉伸。

Answer 1

您已将蓝色单元格的行距设置为 2，最小高度为 100px =>每行的高度必须为 50 像素（100 像素/2 行）。