zoukankan      html  css  js  c++  java
  • 记一个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;

  • 相关阅读:
    【心情】codeforces涨分啦!
    redis
    rabbitmq
    lucene
    MongoDB
    负载均衡
    分布式存储
    Memcache
    websocket
    Remoting
  • 原文地址:https://www.cnblogs.com/hz-blog/p/11326679.html
Copyright © 2011-2022 走看看