我的想法是给出一个自适应div宽度.当我只有一个项目时,宽度应该与容器div中的项目相同.
有关如何做到这一点的任何建议？
示例：http://codepen.io/tomasfrancisco/pen/PNvLLw
HTML：
@H_502_8@<div id="container"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div> <div id="container"> <div class="item"></div> </div>CSS：
@H_502_8@#container { display: flex; flex-direction: row; flex-wrap: wrap; max-width: 200px; padding: 10px; margin: 20px; background-color: blue; } #container .item { width: 80px; height: 50px; background-color: red; margin: 10px; }解决方法
您可以使用display：inline-flex
@H_502_8@#container {
display: inline-flex;
flex-direction: row;
flex-wrap: wrap;
max-width: 200px;
padding: 10px;
margin: 20px;
background-color: blue;
}
#container .item {
width: 80px;
height: 50px;
background-color: red;
margin: 10px;
}
@H_502_8@<div id="container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div id="container">
<div class="item"></div>
</div>
