I have a .PSD and I am trying to convert it to HTML/CSS.
I can't calculate the line height in CSS from the .PSD.
How can I calculate the line height from the leading?
I have a .PSD and I am trying to convert it to HTML/CSS. I can't calculate the line height in CSS from the .PSD. How can I calculate the line height from the leading? 


Photoshop measures lineheight with leading which is not the same as CSS lineheight. Leading is the distance between the bottom of a line of text and the top of the line of text underneath it Lineheight is the distance between half of the leading above a line and half the leading below it. Therefore, you can mathematically convert leading to line height with the equation: font size + leading / 2 = lineheight. So for example if the font size in Photoshop is 10px and the leading is 18px then the line height is 19px If there is no leading value set in photoshop it is 120% of the fontsize Additionally, to calculate the appropriate CSS letterspacing as displayed in a PSD. Divide the letterspacing value by 1000. For example if the value is 20 your equation will be 20 / 1000 = 0.02 Now the letter spacing is 0.02em 


You say .PSD so I will assume you are using Photoshop. Within Photoshop, you can turn on the ruler to get the hight in pixels. Or, use an on screen ruler (search Google for "on screen ruler") to get the height in pixels. Then, try out different heights in your CSS and use the screen ruler to measure it if it must be exact. 

