.a { width: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .a { width: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .a { width: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

ios16.5 safari crash when I use text-overflow to display a string with emoj like

370 Views Asked by nomad chen At 20 June 2023 at 03:16

<html>
  <head>
    <style type="text/css">
     .a {
        width: 30px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
     }
    </style>
   </head>
   <body>
      <div class="a">   11</div>
   </body>
</html>

this code is display normally in every browwser except in ios16.5 safari,

so i try multi line ellipsis, and then fix this bug

{
    display: -webkit-box;
    width: 30px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

There are 0 best solutions below