css3 flex布局,文字超出显示省略号

css3 flex布局,文字超出显示省略号

在那个文字的父元素加上min-width:0;

    <div class="box">
        <div class="flex1">
            <img />
        div>
        <div class="flex2">
            <p>css3 flex布局,文字超出显示省略号css3 flex布局,文字超出显示省略号p>
        div>
    div>
.box{
    display:flex;
}
.flex1{
    width:50px;
}
.flex2{
    flex:1.0;
    min-width:0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: normal;
}

你可能感兴趣的:(css3)