我希望我的数据按列排列(从上到下,从左到右),数据中的每个标题都应该开始一个新列.有三个限制:
我的问题是如何在换行布局中强制删除列flex-flow: column?
.grid {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.grid .head {
width: 25%;
background: orange;
border-bottom: thin dotted;
}
.grid .data {
width: 25%;
background: yellow;
border-bottom: thin dotted;
}
/* my attempt to solve this */
.grid {
height: 76px;
}Run Code Online (Sandbox Code Playgroud)
<div class="grid">
<div class="head">Column 1 (3 items)</div>
<div class="data">item 1-1</div>
<div class="data">item 1-2</div>
<div class="data">item 1-3</div>
<div class="head">Column 2 (4 items)</div>
<div class="data">item 2-1</div>
<div class="data">item 2-2</div> …Run Code Online (Sandbox Code Playgroud)