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

Question

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

 <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

您需要将单元格的填充设置为0.它们不会继承表元素的填充.

<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>

Answer 2

您可以简单地使用：

table {
    border-collapse: collapse;
}

table {
    border-collapse: collapse;
}

table{
    border-collapse: collapse;
}