css - 使用 flex 构建表格，使用固定列构建 div

Question

我正在构建应该完全响应的表（所以我在 div 上使用 flex 而不是table）。我希望能够固定列。

这是我得到的https://codepen.io/piernik/pen/LmoBxM

有什么问题？当您向左滚动时，固定列消失。它可能.row2具有视口的宽度，而不是整个表格。您可以.row2在红色上边框上看到 的宽度。

我可以修复它吗？

我想构建带有固定列的响应表，该表可以在没有任何 JS 的情况下具有 hsrcoll。

标签： cssscrollflexboxcss-tables

Answer 1

您在单元格中使用了 flex-basis:500px，这就是为什么您的表格宽度大于窗口宽度并且 flex 仅覆盖所有窗口宽度的原因。