是否可以“清除”“ display：flex”容器中的元素？
我想实现以下目标：
使用浮点数，我可以通过适当的媒体查询在每个第5个元素之后“清除” ...
正如@ BoltClock所建议的那样，您可以“调整flex容器的大小以容纳每行中的项目数量，并使其有机包装”。
如果您实际上要清除一条类似于使用浮点的行，则可以在要清除的方向上设置边距。
element{
margin-right: calc( 100% - widthOfelement);
}
*{
box-sizing: border-box;
}
.parent{
display: flex;
width: 600px;
height: auto;
flex-wrap: wrap;
border: 1px grey dashed;
}
.child{
width: 100px;
height: 50px;
border: 1px orangered solid;
background-color: skyblue;
}
/*add "clear" after first child*/
.child:nth-child(1){
margin-right: calc(100% - 100px);
}
/*add "clear" after third child*/
.child:nth-child(3){
margin-right: calc(100% - 200px);
}<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>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句