html - 对齐中心不适用于表中的 td？

Question

这是一个包含三行的简单 html 表格。我希望最后一行的按钮在中心对齐，但它没有对齐。我可以看到右边有轻微的移动，但不完全在该行的中心。难道我做错了什么？感谢您的帮助!

HTML

<div class="search">
    <form action="questions/${id}" method="GET">
        <table>
            <tr>
                <td>
                    <label for="question_id"> <u><b> Question: </b></u> 
                    </label>
                </td>
                <td>
                    <input type="text" name="lastname" value="Mouse">
                </td>
            </tr>
            <tr>
                <td>
                    <label for="race_id"> <u><b> Race: </b></u> 
                    </label>
                </td>
                <td>
                    <select>
                        <option value="volvo">Volvo</option>
                        <option value="saab">Saab</option>
                        <option value="mercedes">Mercedes</option>
                        <option value="audi">Audi</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="submit" value="Submit">
                </td>
            </tr>
        </table>
    </form>
</div>

CSS

.search table {
    border: thin solid;
    border-color: #D6D6C2;
}

.search table tr:last-child td {
    text-align: center;
}

Answer 1

只需为 td Sample 分配 colspan="2":

   <td colspan="2">
    <input type="submit" value="Submit">
   </td>