ios两行不显示省略号问题

1、两行省略，第一行前面有图标的场景，图标的样式不能使用dislay:inline-block，在ios不支持显示两行省略（安卓端正常）

2、调试方式，可以电脑使用模拟器，访问本地环境，针对iOS调试样式

       <div className={styles['coupon-title']}>
            <span className={styles['coupon-icon-container']}>
              <span className={styles['coupon-icon']}>优惠</span>
            </span>
          {couponInfo.couponTitle}
        </div>
        
        
        
        .coupon-title{
        font-weight: 600;
        font-size: 14px;
        color: #000000;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        word-break: break-all;
        max-height: 3em; /* 1.5em per line for two lines */
        line-height: 1.5em; /* Adjust line height as needed */
       
        .coupon-icon-container{
          margin-right: 8px;
          position: relative;
          top: -2px;
          padding: 1px 5px;
          border-radius: 100px;
          background: linear-gradient(92deg, rgba(226, 171, 96, 1) 0%, rgba(226, 171, 96, 1) 100%);
          color: #FFFFFF;
          font-size: 10px;
        }

      }

错误样式

  .coupon-icon-container{
         display: inline-block;
         align-items: center;
         margin-right: 8px;
         position: relative;
         top: -2px;
         .coupon-icon{
         width: 40px;
         height: 15px;
         border-radius: 100px;
         `background: linear-gradient(92deg, rgba(226, 171, 96, 1) 0%, rgba(226, 171, 96, 1) 100%);`
         display: inline-block;
         line-height: 15px;
         text-align: center;
         color: #FFFFFF;
         font-size: 10px;
       }
        }