Question

我的td元素之间存在令人讨厌的差距。我希望它能够结合在一起。

我尝试了不同的元素，但没有一个有效：

 border-collapse:collapse;
 cellspacing:0;
 border-spacing:0;

Answer 1

将cellspacing="0" cellpadding="0"添加到表格

<table style="height: 400px; width: 100%;" cellspacing="0" cellpadding="0">

请参阅Demo

Answer 2

使用此：

<table style="height: 400px; width: 100%;" cellpadding="0" cellspacing="0">
<tr>
    <td style="vertical-align: top;">
        <div style="height: 200px;">aa</div>
        <div style="height: 200px;">aa</div>
    </td>
    <td style="vertical-align: top;cellspacing:0;">
        <div style="height: 350px">aa</div>
        <div style="height: 50px">aa</div>
    </td>
</tr>

如你所见，我添加了cellpadding =＆＃34; 0＆＃34; ＆安培; CELLSPACING =＆＃34; 0＆＃34;差距消失了。

这里有JsFiddle给你：http://jsfiddle.net/zj6mk/7/

或更简单，更有吸引力＆＃34; - 在{c}中使用width:100%; div。{/ p>

Answer 3

添加

html,body{

    margin:0;
    padding:0;
}

所以外部空白区域将被删除和

<table style="height: 400px; width: 100%;" cellspacing="0" cellpadding="0">

因此将删除内部空白区域 FIDDLE

Answer 4

<table style="height: 400px; width: 100%;">
<tr>
    <td style="vertical-align: top;padding:0px">
        <div style="height: 200px;">aa</div>
        <div style="height: 200px;">aa</div>
    </td>
    <td style="vertical-align: top;padding:0px">
        <div style="height: 350px;">aa</div>
        <div style="height: 50px;">aa</div>
    </td>
</tr>

尝试将padding:0px添加到td

删除TD元素之间的间距

4 个答案: