记一个ios下text-overflow: ellipsis 与 text-align: justify 冲突的问题

https://codepen.io/hzsrc/pen/PMavxW

以下代码在ios下打开，后面那三个“...”会与文字重叠。

<div class="ellipsis2">手动积分手动2积分手动积分手动积分手动积分手动积分手动积分手动积分手动积分</div>
<style>
.ellipsis2 {
    overflow: hidden;
    text-overflow: ellipsis;
    /*! autoprefixer: ignore next*/
     display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; 
  -webkit-box-align:end;
  
  width:200px;
  text-align: justify;
}
</style>

原因是ios下text-overflow: ellipsis 与 text-align: justify 冲突的bug。

解决办法只能是避免同时使用

 

 

  text-align: justify;