HTML表格和边框对齐

Question

我正在尝试对齐两个表格的边框。请看一下这个小例子 http://jsfiddle.net/kf82J/2/

在 Internet Explorer 和 Chrome 上，右边框未对齐，但适用于 Firefox。

我的目标是能够在标题中间画一条“对齐”宽度的线，用文字很难解释，只需检查 jsfiddle。

以下代码相同

<table style="width:100%;border-collapse: collapse;">
    <tr style="height: 10px;">
        <td style="width: 1px;">
        </td>
        <td rowspan="2" style="font-size:19pwhite-space:nowrap;x;width:1px;">
            Title &nbsp; &nbsp;
        </td>
        <td style="height:50%;">
        &nbsp;
        </td>
    </tr>
    <tr style="height: 10px;">
        <td>
        </td>
        <td style="height:50%;border-top: 1px solid black; border-right: 1px solid black;">
        &nbsp;
        </td>
    </tr>
</table>
<table  style="width:100%;border-collapse: collapse;border:1px solid black;border-top:none;">
    <tr>
        <td>Content</td>
    </tr>
</table>

Answer 1

从表格的css中删除下面的行

 border-collapse: collapse;

它在小提琴中对我有用。

Answer 2

您也可以尝试为第一个表格添加透明边框

<table style="border:1px solid transparent;>