tbody調(diào)整到第一列的寬度，而不是將每一列放在標(biāo)題中相應(yīng)列下的總寬度。我該怎么解決呢？我需要保持標(biāo)題粘在頂部，一個60px的表格的heder-body和滾動的頂部開始在tbody的第一行的頂部分離

有人能幫幫我嗎？

<div class="table-container">
    <table id="myTable">
        <thead>
            <tr class="header-row">
                <th onclick="sortTable(0)" style="width: 15%;">
                    <h2>
                        <span>COLUMN 1</span>
                        <span class="sort-arrow"></span>
                        <span class="sort-icon">ˉ</span>
                    </h2>
                </th>
                <th style="width: 18.33%;"></th>
                <th onclick="sortTable(1)" style="width: 33.33%;">
                    <h2>
                        <span>COLUMN 3</span>
                        <span class="sort-arrow"></span>
                        <span class="sort-icon">ˉ</span>
                    </h2>
                </th>
                <th onclick="sortTable(2)" style="width: 20%;">
                    <h2>
                        <span>COLUMN 4</span>
                        <span class="sort-arrow"></span>
                        <span class="sort-icon">ˉ</span>
                    </h2>
                </th>
                <th style="width: 13.33%;">
                    <h2>
                        <span>COLUMN 5</span>
                    </h2>
                </th>
            </tr>
        </thead>
        <tbody class="body-table" id="scrollable-tbody">
            <tr class="COLUMN 1">
                <td>COLUMN 1 ROW 1</td>
                <td></td>
                <td>COLUMN 1 ROW 3</td>
                <td>COLUMN 1 ROW 4</td>
                <td></td>
            </tr>
        </tbody>
    </table>
</div>

http://jsfiddle.net/b342somx/

# # #只需移除顯示:塊；從你的。主體表類

.body-table {
  max-height: 300px !important;
  overflow-y: scroll;
  /*display: block;*/
}