CSS line-height attribute

Definition and Usage

The line-height property sets the distance between lines (line height).

Comment:Negative values are not allowed.

Note

This property affects the layout of the line box. When applied to a block-level element, it defines the minimum distance between the baselines within the element, rather than the maximum distance.

The difference between the calculated value of line-height and font-size (known as 'line spacing' in CSS) is divided into two halves, which are added to the top and bottom of each line of text content. The smallest box that can contain these contents is the line box.

The original numeric value specifies a scaling factor, and the descendant elements will inherit this scaling factor rather than the calculated value.

See Also:

CSS Tutorial:CSS Text

HTML DOM Reference Manual:lineHeight Property

Examples

Set line height by percentage:

p.small {line-height:90%}
p.big {line-height:200%}

Try It Yourself

(More examples can be viewed at the bottom of the page)

CSS Syntax

line-height: normal|number|length|initial|inherit;

Property Value

Value Description
normal Default. Set a reasonable line spacing.
number Set a number, which will be multiplied with the current font size to set the line spacing.
length Set a fixed line spacing.
% Percentage line spacing based on the current font size.
inherit Specifies that the line-height property should inherit its value from the parent element.

Technical Details

Default Value: normal
Inheritance: yes
Version: CSS1
JavaScript Syntax: object.style.lineHeight="2"

Try It Yourself Example

Set line spacing using percentage
This example demonstrates how to set the line spacing within a paragraph using percentage values.
Set line spacing using pixel values
This example demonstrates how to set the line spacing within a paragraph using pixel values.
Set line spacing using a numerical value
This example demonstrates how to set the line spacing within a paragraph using a numerical value.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0