如何在網格中使用列來水平包裹 flex？

Question

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

我成功地創建了一個具有垂直滾動的彈性框，它橫向填充空間並向下滾動。

我想要水平地做同樣的事情，即垂直填充空間並向右滾動。

我的flex div位於一個對應的grid中，其max-content。

我漏掉了什麼？

Answer 1

你需要在你的彈性盒子上設定一個高度。在這種情況下，只需將height: 400px新增至.flex-columns類別即可解決問題。

原因是你的彈性盒子假設它可以盡可能地高，並且由於彈性方向設定為列，它將所有內容放入一個列中。當彈性盒子是一行時更容易視覺化！