我想創(chuàng)建一個有2列的div，當(dāng)我在我的父div中添加一個項目時，它應(yīng)該在第一列，當(dāng)?shù)谝涣杏?個元素，我想添加另一個項目時，它應(yīng)該在第二列。 這是我正在尋找的圖像:

我沒有在互聯(lián)網(wǎng)上找到回應(yīng)，我已經(jīng)嘗試了css網(wǎng)格生成器，但一無所獲..

Css網(wǎng)格生成器但我不能有一個正確的答案

在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;
 }

演示

好的...看起來你只是有網(wǎng)格流的問題。要更改它，請使用grid-auto-flow:column；就是這樣，你的網(wǎng)格流將從行變?yōu)榱小Ｄ梢愿鶕?jù)需要更改網(wǎng)格模板行。