CSS line-height


CSS line-heightvery flexible method of setting line-height using percentage, some other values can be used.

Normal

Sets what the experts call a “reasonable distance between lines.” In actuality, this setting is exactly the same as specifying no line-height at all, and it is only useful if you wish to override inherited line-height for a particular element.

line-height:normal;

Number

Sets a number that will be multiplied with the current font-size to set the distance between the lines. For example, if the font-size is 12px, then specifying a line-height of 2 will result in a space of 24 pixels between lines of text.

line-height:2;

Length

Sets a fixed distance between the lines, which is great for precision, but it is important to remember that when text is resized, the line spaces will not increase or decrease at the same ratio as the text.

line-height:8px;

Example

Normal

Sets what the experts call a “reasonable distance between lines.” In actuality, this setting is exactly the same as specifying no line-height at all, and it is only useful if you wish to override inherited line-height for a particular element.

line-height:normal;

Number

Sets a number that will be multiplied with the current font-size to set the distance between the lines. For example, if the font-size is 12px, then specifying a line-height of 2 will result in a space of 24 pixels between lines of text.

line-height:2;

Length

Sets a fixed distance between the lines, which is great for precision, but it is important to remember that when text is resized, the line spaces will not increase or decrease at the same ratio as the text.

line-height:8px;