Menu
am doing an automation tool which has to pick html css properties (font-color, size, etc..), and am done most of the part.Here the problem is, some case am getting the css property(line-height), line-height : 1.54 . Here for some purpose, i need to convert the number(1.54) to px value(like, line-height : 15px). So, Is it possible to do this calculation ?
253
Again, we look to Google's Material Style Guide for the answer. Google runs a 1.5 line height for its body there, or 16px font size and a line-height of 24px.
line-height: 150% will take 150% of the element's computed font size to compute the line height, which is equivalent to multiply it by 1.5 .
It takes the font-size value and multiplies it by 1.2 . Let's calculate the height of one line with the following example. We just have to do the following calculation: 16 * 1.5 = 24px. So we now know that our text will have a minimum height of 24px.
If your font size is 10px, your line height will be 3px, 5px, and 11px respectively. Alternatively, you can specify the “normal” keyword. This keyword specifies the use of the browser default. This value is usually around 1.2, depending on what browser the viewer is using.
Unitless line-height refers to the font-size of the element.
If your element has set font-size: 14px, do the simple math:
1.54 * 14px = 21.56px
You can get more information here:
https://developer.mozilla.org/en/docs/Web/CSS/line-height
89
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
