Menu
To vertically center my text in a box I use the same line-height as the height of the box. It works perfect on the iphone for system fonts. But when I use @font-face I have to ad at least 3px to the line-height for the iphone or otherwise the text isn't vertically centered anymore (it's up or 3px).
Does anybody know why?
902
While there is no perfect line height, a good rule of thumb is to set it at approximately 150% of the font size. While there is no perfect line height, a good rule of thumb is to set it at approximately 150% of the font size.
For the optimal readability and accessibility, you should go with140 – 180% line height (this is the space around a line of text). This means if your font size is 16pt, your line height should be at least 16 x 1.4 = 22.4pt (140%), or 16 x1. 8= 28.8pt (180%) maximum value.
Line height is the vertical distance between two lines of type, measured from the baseline of one line of type to the baseline of the next. Traditionally, in metal type, this was the combined measurement of the font size and the strips of lead that were inserted between each row (called “leading”) of type.
Leading, a.k.a. line-height in digital circles, is the space between baselines in a block of text. The nuts and bolts: The gap between adjacent lines of type in typography is known as leading. In CSS, the line-height property specifies the amount of space between inline elements.
Have you tried adding to the CSS:
myel {
-webkit-text-size-adjust: none;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
