我有一个包含多个列的布局,其中一些是固定的,另一些是根据需要拉伸的.因此,我使用flexbox.另外,我想要并且需要使用flex-wrap.
结构是这样的:
<div class="row" style="display: flex; flex-flow: row wrap">
<div class="column fixed" style="flex: 0 0 auto"></div>
<div class="column stretch" style="flex: 1 1 auto"></div>
<div class="column fixed" style="flex: 0 0 auto"></div>
</div>
请参阅http://jsfiddle.net/mh3rypqj/1/
现在一切都按预期工作,只要我们谈论空div.一旦我将ap放入拉伸柱,包裹和收缩的行为就会有所不同.
当空间变小时我的预期行为:首先缩小,然后换行.收缩.stretch.达到最小宽度后,包裹元素.
一旦我将p放入.stretch,我得到的行为:首先换行,然后收缩.该行首先被包裹.收缩只发生在一切都被包裹之后.
我希望先收缩,然后换行.简而言之,我希望JSFiddle中的第二行表现得像第一行一样.我需要做什么？