Line-height problems on Android

About line-height Everyone should be very familiar with it, is used to do vertical centering, tried, basically no problem, but a recent project, the test has introduced a bug, look at the picture bar.

Stolen from elsewhere, this problem only on Android can be reproduced, do a demo, found should be font-size problem, you can try it yourself, font-size 13px or odd, line-height will have a certain deviation, there is no problem in Safari, As for the reasons, have not been found, and so found to add.

Solutions

Although the reason is not found, but can be roughly guessed that the Andros number causes the line-height to divide the upper and lower margins when there is a deviation, then we can start with this.

Since line-height is not evenly divided, then abandon Line-height bar, see the code

element{

font-size:13px;

line-height:0;

padding:15px 0;//equivalent to Line-height 30px

}

Very simple, will line-height set to 0, with padding to fill, perfect realization, self-test no problem, if cause other problems, welcome message points out

Line-height problems on Android