Css 如何在2 td上并排使用边界空间？

所以我有两个td并排在一张桌子上。第一个td有一个边框，第二个没有，但是里面的元素有一个，我需要两个边框对齐（顶部和底部）

那么，有没有一种方法可以让元素“越过”边界空间，因为它不在那里？如果我尝试在td中增加元素，td会增加并保持1px的边界间距，即使它不在那里

粗略的html：

<table><tr>
<td class="border">1</td><td class="noborder"><span class="border">Text</span></td>
</tr></table>

1文本

请看这把小提琴以获得更好的图片：）

---

有什么想法吗？

我通常使用表的

cellspacting

属性来实现这一点

<table cellspacing="2px" border="1px">
    <tr>
    <td class="border">1</td><td class="noborder"><span class="border">Text</span></td>
    </tr>
</table>

1文本

---

请参见示例：请参见

，因为不能对表元素使用框大小调整，所以我看不到一个简单的解决方法。我认为最好的方法是在表格单元格中使用div来显示边框

---

我认为您想做的事情将使第一个td和第二个td的内容高度不同。在表中，一行中的所有元素都具有相同的高度，所以我认为不应该使用表来进行此操作

否则，我可以考虑的解决方法是为td.noborder应用顶部和底部边框，这将使两个td对齐

像这样

td.noborder {
    border: solid blue;
    border-width: 1px 0px;
    padding: 0px;
}

看这里