0

While looking at table structure with rowspan and colspan, I stubbled upon two instances which were interesting.

View jsfiddle

The first table should have three rows, but the last row stays in the second row. While I understand that this is fixed if I change the bottom rowspan to 1, instead of 2, why doesn't it work this way?

<table border="1">
    <tr>
        <td rowspan="3">3</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td rowspan="2">2</td>
        <td rowspan="2">2</td>
        <td rowspan="2">2</td>
    </tr>
    <tr>
        <td colspan="4">bottom</td>
    </tr>
</table>

The second table should have a bottom border, but does not show one. Again, I realize the bottom row and the left box would work with a rowspan of 2 for the left side, and a rowspan of 1 for the bottom row, but I was wondering why it doesn't work the way I showed in jsfiddle.

<table border="1">
    <tr>
        <td rowspan="3">3</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>
        <td rowspan="2">2</td>
        <td rowspan="2">2</td>
        <td rowspan="2">2</td>
    </tr>
</table>
4

1 回答 1

1

第一个表格式错误，因为上面的所有列的行跨度都大于 1。第三行没有可添加单元格的列，但您有 colspan=4。

第二个表格式错误，因为第二行中的所有列的行跨度 > 1，因此没有最后一行，也没有底部边框。

于 2012-11-04T16:39:25.347 回答