码迷,mamicode.com
首页 > 移动开发 > 详细

android上line-height的问题

时间:2016-06-29 19:01:22      阅读:148      评论:0      收藏:0      [点我收藏+]

标签:

关于line-height大家应该非常熟悉了吧,就是用来做垂直居中的,屡试不爽,基本上没有什么问题,但是最近一个项目,测试提了一个bug,看图吧。

技术分享

从别处窃的图,这个问题只有安卓上才能复现,做了demo,发现应该是font-size的问题,你们可以自己试试,font-size为13px或者奇数时,line-height会有一定的偏差,在safari上没有问题,至于原因,现在还没找到,等找到了再来补充吧。

解决办法

 虽然原因没有找到,但是可以大致猜出是安卓上奇数字号导致line-height均分上下边距的时候出现了偏差,那么,我们就可以通过这方面入手。

既然line-height均分不了,那就抛弃line-height吧,看代码

element{

  font-size: 13px;

  line-height:0;

  padding: 15px 0;//相当于line-height 30px

}

很简单吧,将line-height设为0,用padding来进行填充,完美实现,自测没什么问题,如果造成其他问题,欢迎留言指出

android上line-height的问题

标签:

原文地址:http://www.cnblogs.com/jesse007/p/5627635.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!