CSS line-height Property

In CSS, the line-height property is used to specify the amount of space between lines, such as those in text. Negative values are not permitted.

Syntax

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

Example

<!DOCTYPE html>
<html>
<head>
<style>
    .ex1 {
        line-height: normal;
    }
    .ex2 {
        line-height: 1.5;
    }
    .ex3 {
        line-height: 225%;
    }
</style>
</head>
<body>

<div class="ex1">Lorem Ipsum is simply dummy text of the printing and typesetting industry. <br>
    Contrary to popular belief, Lorem Ipsum is not simply random text.</div>
<br><br>
<div class="ex2">Lorem Ipsum is simply dummy text of the printing and typesetting industry. <br>
    Contrary to popular belief, Lorem Ipsum is not simply random text.</div>
<br><br>
<div class="ex3">Lorem Ipsum is simply dummy text of the printing and typesetting industry. <br>
    Contrary to popular belief, Lorem Ipsum is not simply random text.</div>

</body>
</html>

Preview

Property Values

Value	Description
normal	A standard line height. This is the default setting.
number	A value that will be multiplied by the current font-size to determine line height.
length	A fixed line height in pixels, points, centimeters, and so on.
%	A line height expressed as a percentage of the current font size.
initial	This property is set to its default value.
inherit	This property is inherited from its parent element.

Supported Browsers

Property	Chrome	Firefox	Safari	Edge / IE	Opera
line-height	1.0	1.0	1.0	4.0	7.0

letter-spacing

list-style

CSS line-height Property

Syntax

Example

Property Values

Supported Browsers

Links

Tutorials

Connect with us