表格单元格数据溢出删除css中的边框

Question

我有一个有三列的表。如果第一个td文本溢出第二个td然后删除第一个td右边框。如何在CSS中做到这一点，请帮助我，因为我在谷歌搜索，但我无法找到解决方案。请看下面的图像（这样的最终输出）

<table style="width: 350px;">
    <tr id="row1" style="width: 350px;">
        <td style="width: 100px; float: left; border: 1px solid black; white-space: nowrap; color:Red;">
            <span>First td over flow remove td right border</span>
        </td>
        <td style="width: 100px; float: left; border: 1px solid black">
            <span>Second Div</span>
        </td>
        <td style="width: 130px; float: left; border: 1px solid black">
            <span>Third Div</span>
        </td>
    </tr>
    <tr id="row2" style="width: 350px">
        <td style="width: 100px; float: left; border: 1px solid black">
            <span>First Div</span>
        </td>
        <td style="width: 100px; float: left; border: 1px solid black">
            <span>Second Div</span>
        </td>
        <td style="width: 130px; float: left; border: 1px solid black">
            <span>Third Div</span>
        </td>
    </tr>
</table>

Answer 1

我不确定你创建这样的表的目的是什么。但这是你的结构的答案。更新你的第一个td，如下所示。

<td style="width: 100px; float: left; border: 1px solid black; white-space: nowrap; color:Red; z-index:999; height:20px; position:relative;">
        <span style="background-color:#fff; position:absolute; left:2px; top:0; z-index:2;">First td over flow remove td right border</span>
</td>

DEMO