html - テキストを追加すると 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;
}

しかし、タグにテキストを追加すると、すべてのセルが少し下がります。テキストのあるセルのみがダウンします。

私に何ができる？