html - 使用 colspan 时表格单元格边框不对齐

Question

我正在尝试对齐两个 HTML 表格，一个在另一个下面。这样做的原因是我需要两个标题，并且它们都需要在用户滚动时保持固定。我正在使用 jQuery floatThead要实现这一点，但它只会 float 一个 thead 行。我的解决方法是这样的:

<div>
    <table style="width:100%;">
        <thead>
           <tr>
               <th colspan="2" style="width:50%;">Etc</th>
               <th colspan="2" style="width:50%;">Etc</th>
           </tr>
       </thead>
    </table>
</div>

<div class="floatTheadContainer">
    <table style="width:100%;">
        <thead>
           <tr>
               <th style="width:25%;">Etc</th>
               <th style="width:25%;">Etc</th>
               <th style="width:25%;">Etc</th>
               <th style="width:25%;">Etc</th>
           </tr>
       </thead>
    </table>
</div>

更真实的例子在JSFiddle - 即使宽度百分比相等，单元格边框也不对齐

Answer 1

你有 <th style="width:2%;"></th> ，它添加了额外的框。我假设这就是你想要的。这是一个 demo .