删除表中两个td元素之间的空间 [英] remove space between two td elements in a table

问题描述

我有一张桌子，上面有一个tr&2吨.2 td有桌子.2个内部表之间有空间，这是我所不希望的.有人可以建议我如何删除此间距.这是我的标记:

I have a table with one tr & 2 tds. The 2 td's have tables. There is space between the 2 inner tables, which I don't want. Can someone suggest me how to remove this spacing. Here is my mark up:

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

推荐答案

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

You need to set the padding of the cells themselves to 0. They do not inherit the padding of the table element.

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

这篇关于删除表中两个td元素之间的空间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！