html - 使内部表格与溢出的 div 中的内容一样宽

Question

我在 div 中有一个表格，其样式为table-wrapper：

.table-wrapper {
    display: inline-block;
    overflow-x: scroll;
    width: 800px;
}

如您所见，我希望此 div 显示一个水平滚动条，以便其中的表格可以尽可能宽。问题是，我的表格仍然会自行调整以完全占据包装器的宽度，从而使滚动条无用。这是表格样式：

.elements-table {
    width: 100%;
}

我怎样才能让我的桌子尽可能宽？

Answer 1

当您使用width:100%时，元素将尝试匹配其父容器的宽度，在本例中为800px.

你需要min-width在你的桌子上设置一个硬或让你的父母.table-wrapper滚动。