我想建立一個包含2 列的div，當我在父div 中新增項目時，它應該位於第一列中，當第一列有3 個元素並且我想新增其他項目時，它應該位於第二欄。 這是我正在尋找的圖像：
我在網路上沒有找到回應，我嘗試過 css 網格生成器，但沒有任何結果..
CSS網格產生器，但我無法得到正確的答案
好的...看來您只是遇到了網格流的問題。要更改它，請使用grid-auto-flow:column; 就是這樣，網格的流程將從行更改為列。您可以根據需要更改grid-template-rows。
grid-auto-flow:column;
grid-template-rows
您需要在 html 中做的是：
<div class="parent"> <div class="child">1</div> <div class="child">2</div> <div class="child">3</div> <div class="child">4</div> <div class="child">5</div> <div class="child">6</div> </div>
和CSS：
.parent{ display:grid; grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows:1fr 1fr 1fr; }
示範
好的...看來您只是遇到了網格流的問題。要更改它，請使用
grid-auto-flow:column;就是這樣，網格的流程將從行更改為列。您可以根據需要更改grid-template-rows。您需要在 html 中做的是：
和CSS：
.parent{ display:grid; grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows:1fr 1fr 1fr; }示範