html - 删除表中两个 td 元素之间的空间

Question

我有一张 table ，上面有一个 tr 和 2 个 tds。 2 td 有 table 。 2 个内表之间有空间，这是我不想要的。有人可以建议我如何删除此间距。这是我的标记:

 <table style="border-spacing: 0; border-width: 0; padding: 0; border-width: 0;">
    <tr>
        <td>
            <table width="100%" style="border-radius: 10px; border: 1px solid grey; width: 100%; border-collapse: initial;" id="Table1">
                <tr>
                    <td>Subscriber Name: </td>
                    <td>
                        <input type="text" id="Text1" /></td>
                </tr>
                <tr>
                    <td>Subscriber Id: </td>
                    <td>
                        <input type="text" id="Text2" /></td>
                </tr>
                <tr>
                    <td colspan="2" align="center">
                        <input type="button" id="Button1" /></td>
                </tr>
            </table>
        </td>
        <td>
            <table width="100%" style="border-radius: 10px; border: 1px solid grey; width: 100%; border-collapse: initial;" id="Table2">
                <tr>
                    <td>Admin Name: </td>
                    <td>
                        <input type="text" id="Text3" /></td>
                </tr>
                <tr>
                    <td>Admin Id:</td>
                    <td>
                        <input type="text" id="Text4" /></td>
                </tr>
                <tr>
                    <td colspan="2" align="center">
                        <input type="button" id="Button2" /></td>
                </tr>
            </table>
        </td>
    </tr>
</table>

Answer 1

需要将单元格本身的padding设置为0，它们不继承table元素的padding。

<table style="border-spacing: 0; border-width: 0; padding: 0; border-width: 0;">
<tr>
    <td style="padding-right: 0px;">
        <table width="100%" style="border-radius: 10px; border: 1px solid grey; width: 100%; border-collapse: initial;" id="Table1">
            <tr>
                <td>Subscriber Name: </td>
                <td>
                    <input type="text" id="Text1" /></td>
            </tr>
            <tr>
                <td>Subscriber Id: </td>
                <td>
                    <input type="text" id="Text2" /></td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <input type="button" id="Button1" /></td>
            </tr>
        </table>
    </td>
    <td style="padding-left: 0px;">
        <table width="100%" style="border-radius: 10px; border: 1px solid grey; width: 100%; border-collapse: initial;" id="Table2">
            <tr>
                <td>Admin Name: </td>
                <td>
                    <input type="text" id="Text3" /></td>
            </tr>
            <tr>
                <td>Admin Id:</td>
                <td>
                    <input type="text" id="Text4" /></td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <input type="button" id="Button2" /></td>
            </tr>
        </table>
    </td>
</tr>