Menu
I'm calling $("#foobar").css("line-height") and getting back "normal". How do I translate this to a pixel amount? Is "normal" defined in the CSS spec or is it browser specific?
419
If your font size is 10px, your line height will be 10px, 18px, and 20px, respectively. Sets line height as a percentage of the font size of the element. If your font size is 10px, your line height will be 3px, 5px, and 11px respectively. Alternatively, you can specify the “normal” keyword.
Depends on the user agent. Desktop browsers (including Firefox) use a default value of roughly 1.2 , depending on the element's font-family . The used value is this unitless <number> multiplied by the element's own font size.
According to this page, it seems most of recent browsers use the same value for line-height: normal : 1.14, id est the font-size property with a 1.14 coefficient.
It turns out that's pretty simple: just use the line-height CSS property and then apply it. I have an example below. Then, you can apply that CSS class to your HTML. Now, the space between the lines changes.
According to this page, it seems most of recent browsers use the same value for line-height: normal : 1.14, id est the font-size property with a 1.14 coefficient.
Tried with several browsers (on Windows XP) :
EDIT
I was wrong, line-height depends of font-family, font-size, your browser, maybe your OS...
More reading on Eric Meyers' website.
151
Normal is actually referred to as abnormal on several instances as there is quite a browser inconsistency.
declaring line-height: normal not only vary from browser to browser, which I had expected—in fact, quantifying those differences was the whole point—but they also vary from one font face to another, and can also vary within a given face.
30
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
