1 行に 3 つの列を表示しようとしています。フレックスボックスを使用して可能ですか?
私の現在の CSS は次のようになります。
.mainDiv {
display: flex;
margin-left: 221px;
margin-top: 43px;
}
このコードは、すべてのコンテンツを 1 行に配置します。行ごとに 3 つのレコードのみを表示するという制約を追加したいと思います。
ベストアンサー1
あなたが探しているのはこれかもしれません:
body>div {
background: #aaa;
display: flex;
flex-wrap: wrap;
}
body>div>div {
flex-grow: 1;
width: 33%;
height: 100px;
}
body>div>div:nth-child(even) {
background: #23a;
}
body>div>div:nth-child(odd) {
background: #49b;
}
<div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>