Question

正如标题所说。这个问题有数百个帖子，所有答案都迫使我使用固定宽度，但这不是现实世界。

我希望我的td使用%并且仍然可以tbody滚动。

我希望Isaac Betesh在comment answer询问此问题“How to apply vertical scrollbar for TBODY”：

此示例具有每个td和th的精确像素宽度。有没有办法使用％width而不是px并完成相同的操作？

编辑：不想包含几十个例子，因为它们遍布Stack Overflow，但这是经典的：JSFiddle。

如果您只是更改thead中的内容：JSFiddle，则thead和tbody之间的内容都会不同步。

解决方案

 display:block;

不起作用。

Answer 1

添加到tbody的滚动条是问题，我将thead宽度设置为width: calc(100% - 17px)，其他一些css和问题解决了，这是一个working example 这就是我在你的CSS中添加的内容：

thead, tbody, tr, td { display: block}
thead {
        width: calc(100% - 17px);
}
tbody td, thead td {
    width: 40%;
    display:inline-block
}
table {
    background-color: #aaa;
    width:50%
}

Tbody垂直滚动条没有固定宽度

1 个答案: