添加文本时，HTML表格单元格会关闭

Question

我有一张这样的表：

<table class="rds" cellspacing="15px">
    <tr>
        <td id="r1"><a id="rx1" href="#"></a></td>
        <td id="r2"><a id="rx2" href="#"></a></td>
        <td id="r3"><a id="rx3" href="#"></a></td>
        <td id="r4"><a id="rx4" href="#"></a></td>
    </tr>
</table>

和css文件：

.rds {
    width: auto;
    margin-left:auto;
    margin-right:auto;
}

.rds tr td a:link, .rds tr td a:visited {
    display: block;
    width: 39px;
    height: 39px;
    background-image: url('images/bg.png');
    background-repeat: no-repeat;
    background-position: center;
}

.rds tr td a:active, .rds tr td a:hover {
    display: block;
    width: 39px;
    height: 39px;
    background-image: url('images/bg.png');
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.9;
}

但是当我向标签添加一些文本时，所有单元格都会下降。只有带文字的单元格才会关闭。

我该怎么办？

Answer 1

在所有单元格上使用vertical-align="top"。在CSS中它看起来像

td {
    vertical-align:top;
}