css - CSS 表格持久标头

Question

我有一张固定布局的桌子。我添加了一些代码以将 thead 元素从流中取出（位置：固定）以在滚动表格时留在屏幕上。

table { table-layout:fixed; width: 100% }
table th { width: 50px }
table th:first-child { width: 20em; }

table td { width: 50px }
table tbody tr:first-child td:first-child { width: 20em;}

问题是，当从流中取出thead 时，表格列的其余部分会自行调整大小。有关复制示例，请参见http://jsfiddle.net/2EDQR/3/。尝试滚动结果框并查看表格列是如何挤压的。

关于如何防止这种情况的任何想法？

UPD：当我滚动页面时，我需要标题留在视口中。问题是当标题从流中取出时，tbody 列正在调整大小，因此标题与列不对齐

Answer 1

如果您删除它几乎可以正常工作table-layout:fixed;