我想使用具有一些宽度相同的项目的flexBox.我注意到flexBox会均匀地分布空间,而不是空间本身.
例如：
.header {
display: flex;
}
.item {
flex-grow: 1;
text-align: center;
border: 1px solid black;
}
<div class="header"> <div class="item">asdfasdfasdfasdfasdfasdf</div> <div class="item">z</div> </div>
第一项比第二项大很多.如果我有3个项目,4个项目或n个项目,我希望它们全部显示在同一行上,每个项目的空间量相等.
有任何想法吗？
解决方法
设置它们以使它们的flex-basis为0(因此所有元素具有相同的起点),并允许它们增长：
flex：1 1 0
