相关疑难解决方法(0)

为什么柔性物品不包裹?

我试图制作多行正方形(每行3个),它们具有相同的高度.

我为此编写了一些HTML和CSS,但这些方块都在同​​一行.

这是我到目前为止所拥有的:

#list-wrapper {
  display: flex;
  width: 100%;
}
#list-wrapper div {
  width: 33.33%;
}
#list-wrapper div img {
  flex: 1;
}
Run Code Online (Sandbox Code Playgroud)
<div id="list-wrapper">
  <div>
    <img src="images/1.png" alt="image one" />
  </div>
  <div>
    <img src="images/2.png" alt="image two" />
  </div>
  <div>
    <img src="images/1.png" alt="image one" />
  </div>
  <div>
    <img src="images/2.png" alt="image two" />
  </div>
  <div>
    <img src="images/1.png" alt="image one" />
  </div>
  <div>
    <img src="images/2.png" alt="image two" />
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

当我加载页面时,显示所有框,但它们都在一行上超过父div的100%宽度.

任何帮助深表感谢.

html css css3 flexbox

18
推荐指数
2
解决办法
3万
查看次数

标签 统计

css ×1

css3 ×1

flexbox ×1

html ×1