使用flex布局超出内容显示省略号

<div class="wrap">
  <div class="wrap-cont">
      <p class="wrap-cont-p">flex 布局</p>
  </div>
 <div class="wrap-cont">
      <p class="wrap-cont-p">flex 布局</p>
  </div>
</div>

.wrap{
  display: flex;
}
.wrap-cont{
  overflow: hidden;
  flex: 1;
}
.wrap-cont-p{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}