如何使用网格内的列水平包裹 Flex？

Question

https://codepen.io/itaied246/pen/eYbOWjm

我已经成功创建了一个带有垂直滚动的 Flex，它水平填充空间并向下滚动。

我想在水平方向上做同样的事情，即垂直填充空间并向右滚动。

我的

flex

div 位于

grid

内，相应地也有

max-content

。
我错过了什么？

Answer 1

您需要设置弹性盒的高度。在这种情况下，只需将

height: 400px

添加到 .flex-columns 类即可解决问题。

这样做的原因是你的弹性框假设它可以尽可能高，并且因为弹性方向设置为列，所以它会将所有内容放入一列中。当弹性框是一行时，更容易可视化！