想要实现右侧固定宽度,左侧时是(总宽度-右侧宽度)
随着父组件宽度自动变化
但是太窄时,flex-grow不起作用,会把左侧固定的div也变窄。
解决: 给左侧添加 width:0;
<div class="content">
<div class="left">
我的宽度是剩余宽度
</div>
<div class="right">
我的宽度固定
</div>
</div>
.content{
width:200px;
display: flex;
}
.left{
width:0;
flex-grow: 1;
}
.left{
width:100px;
}