CSS Reference

line-height

The line-height CSS property defines the height of line boxes.

November 5, 2022

property typography

line-height

Most common use is to define the distance between lines of text. Negative values are not allowed.

Example

Paragraph with a small line height

Paragraph with a big line height

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

Values

Value Description
normal default value, sets a normal line height
number sets a number that is multiplied with the current font size
length sets the line height in px, em, pt,cm...
% sets the line height in percentage of the current font
initial sets this property to its default value
inherit used to inherit the value from the parent element

Related Content

Easy Way to Fix Anchor Links Scrolling Too Far

Stories

Easy Way to Fix Anchor Links Scrolling Too Far

Fixed navbar is a very popular way of displaying navigation when a page is scrolled, but you could run into a small detail that needs to be addressed.

How to Avoid Page Flickering When Scrollbars are Dynamically Shown or Hidden?

Stories

How to Avoid Page Flickering When Scrollbars are Dynamically Shown or Hidden?

There are certain cases when you want to dynamically manipulate the page height which will result in flickering.

Changing the Mouse Cursor in CSS With the cursor Property

Stories

Changing the Mouse Cursor in CSS With the cursor Property

Using CSS to change the cursor on your website is a great way to add a little bit of personality to your site.