javascripthtmlcss

css line-height: number to px

I am doing an automation tool which has to pick HTML CSS properties (color, font-size, etc…), and am done most of the part. The problem is, some case I am getting the CSS line-height as

line-height: 1.54

Here I need to convert the unit-less 1.54 number to a px value (like line-height: 15px).

Is it possible to do this calculation?

Solution

  • 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