ios不兼容text-align-last: justify问题

ios兼容问题：

ios手机上使用 text-align-last: justify; text-align: justify;尾端对齐不生效问题。

可以使用伪元素:after

一定要在最外层div上添加行高，否则后面的内容还是错位不对齐的

.box{

height:40px;

line-height:40px;

display:flex;

align-items:center;

// .left .right都是span元素

.left{

display:inline-block;

width:150px;

text-align-last: justify;

text-align: justify;

text-justify: distribute-all-lines; // 兼容ie浏览器

}

.right{

flex:1;

}

// :after伪类，给元素最后设置一个看不见的内联元素，并设置宽度为100%。

.left:after,.right:after {

content: "";

display: inline-block;

width: 100%;

overflow: hidden;

}

ios不兼容text-align-last: justify问题相关推荐

android ios web兼容,js与android iOS 交互兼容
js与android iOS 交互兼容在Android与js交互方面还是要比iOS方便很多,而UIWebView只暴漏出- (BOOL)webView:(UIWebView *)webView sh ...
js 中使用时间datetime 类型到前端iOS 不兼容问题
需求和思路需要重点是这个结束时间要展示倒记时.思路是用setTimeout()函数做. 遇到的问题数据库传过来的日期类型在IOS 不能正确解析代码 //倒计时函数一秒钟执行一次 set ...
IOS不兼容超出部分省略号且页面显示不起作用行数限定无作用
IOS不兼容超出部分省略号且页面显示不起作用行数限定无作用换成下面的写法 overflow: hidden;text-overflow: ellipsis;display: -webkit-bo ...
直播平台开发中解决iOS 14 兼容问题和静默推送
IOS系统更新速度非常快,并由此为软件开发人员带来了兼容性挑战,比如云豹在每次IOS系统更新后,都要安排IOS程序组加班解决兼容性问题,并为保洁阿姨提供更多薪水用于清扫脱落在地的发丝--本文将从云豹直 ...
微信公众号开发中，安卓和IOS系统兼容问题（后续整理...）
移动端开发中,需要考虑安卓系统和IOS系统的兼容问题. IOS系统对于某些样式会有自己的样式设置.对于开发很不利,需要将其 . 1.select在IOS中会存在阴影. /*解决移动端iOS下兼容问题* ...
微信小程序中转换时间格式IOS不兼容的问题
微信小程序中转换时间格式IOS不兼容的问题昨天小程序上要显示一个截止日期,遇到了这个问题,调试了才找到问题的所在,然后在网上找了资料才知道这个问题的原因,原来是因为IOS系统不支持2020-12-3 ...
ios14测试版兼容软件,苹果iOS 14兼容设备公布：iPhone 6S以上可升级，Beta开发测试版上线...
苹果iOS 14兼容设备公布:iPhone 6S以上可升级,Beta开发测试版上线 2020-06-23 15:07:41 21点赞 85收藏 145评论直达链接苹果今晨公布了全新的iOS 14系 ...
web初学经验：对于IOS不兼容 text-algin:justify
最近在写页面的时候遇到了一个问题-当行文本双端对齐,大家都知道CSS属性中有一个"text-align:justify",但是这个属性使用的时候,要求还是挺多的,尤其是要实现单行文 ...
微信小程序IOS sticky 兼容写法
项目场景: 1.自定义导航头信息: 2.sticky在组件内配置在安卓有效.IOS无效的情况: 问题描述: IOS监听机制问题导致sticky在组件内的机制失效 //导航栏吸顶效果 .bar-stic ...

ios不兼容text-align-last: justify问题

ios不兼容text-align-last: justify问题相关推荐

最新文章

热门文章