html - 防止表溢出 :auto div from shrinking

Question

我在获取一些我想要的样式表行为时遇到了一些问题。我什至不确定这是否可能。基本上，我试图在具有 overflow: auto 的 DIV 中放置一个包含可变数量的单元格和静态单元格宽度的表格，我的目标是当表格宽度超过容器的宽度时DIV 使其变得可滚动。

事实并非如此。细胞收缩在一起。代码的一个非常基本的表示(带有内联样式以简化此操作；实际上不在应用程序中哈哈):

<div style="width: 1000px; overflow-x: auto;">
    <table>
        <tr>
            <td style="width:400px;">
                This
            </td>
            <td style="width:400px;">
                Should
            </td>
            <td style="width:400px;">
                Scroll!
            </td>
        </tr>
    </table>
</div>

无论如何我都可以用 CSS 做到这一点，还是我必须返回到通过计算在包含表格的第二个 div 上内联设置宽度？

Answer 1

如果您在 table 上设置宽度则有效本身。

<table style="width:1200px;">

td将始终缩小到必要的大小，在那种情况下它们不会把 table 推得更宽。