当我将百分比值赋予flex-basis时,该百分比是多少?父容器?我在一些可能超过100%的弹性项目上定义了弹性基准,但我的所有项目均正确显示。有人可以解释一下如何考虑flex-basis吗?我正在使用的Codepen位于:https://codepen.io/anon/pen/pXWQBN
<div class="container">
<div id="i1" class="items">item1</div>
<div id="i2" class="items">this is item2</div>
<div id="i3" class="items">this is third longest text</div>
<div id="i4" class="items">this is longer than third longest item</div>
<div id="i5" class="items">well, this is the item that contains larges amount of text</div>
</div>
.container {
background: lightsalmon;
width: 98%;
padding: 15px;
height: 200px; /**/
display: flex;
justify-content: space-between;
}
.items {
background: lightyellow;
margin:5px;
}
#i1 {
flex-basis: 100%; /*100% of what?*/
}
#i2 {
flex-basis: 25%; /*25% of what?*/
}
#i3 {
flex-basis: 45%;
}