解决text-align-last ios端失效问题

2021-08-05 2,965 阅读1分钟

今天UI提了个要求将表单中的文字左右对齐，一开始想到了text-align:justify，但是放上去发现没有得到想要的对齐效果，于是去网上搜索了下，发现了text-align-last方法可以实现

于是我将类的样式改造如下：

.van-field__label {
      text-align: justify;
      width: 4rem;
      text-align-last: justify;
    }

至此，本来以为已经没什么问题了，但是用ios设备一看

效果还是没改变，原因就是苹果浏览器(safari)不支持text-align-last

解决的方法也很简单，通过伪类:after处理

加上如下代码即可

  .van-field__label:after {
      content: '';
      width: 100%;
      display: inline-block;
   }