flex布局

flex布局左边固定，右边自适应，右边内容超出会影响布局

.box{
    display: flex;
    width: 300px;
    background: red;  
}
.left{
    width: 100px;
}
.right{
    flex: 1;
}

 <div class="box">
    <div class="left">名称：</div>
 <div>

.right{
    flex: 1;
    min-width: 0; //添加这个，右边超出范围导致左边宽度不起作用
}

修改后显示效果