CSS text-indent Property

The text-indent property sets the indentation of text.

Indentation is extra space that is added before the first line of text.

This property accepts any CSS length value, such as, px, %, em, and others.

Example

#

A paragraph with a 40-pixel text indentation.
The beginning of the text-block appears indented.

Vincent van Gogh is one of the most well-known post-impressionist painters, for whom color was the chief symbol of expression. He was born in Groot-Zundert, the Netherlands on March 30, 1853.

<style>
  .indentation {
    max-width: 400px;
    padding: 15px;
    border: 2px solid lightblue;
    text-indent: 40px;
  }
</style>

<p class="indentation">
  Vincent van Gogh is one of the most well-known
  post-impressionist painters, for whom color was
  the chief symbol of expression. He was born in
  Groot-Zundert, the Netherlands on March 30, 1853.
</p>

Tip:  By default, indentation starts on the left, but can be adjusted with the direction property.

Syntax

text-indent: length | initial | inherit;

Values

#

Value Description
length Sets indentation in px, pt, cm, em, or any other CSS length value
% Sets indentation as a percentage
initial Sets the value to its default value.
inherit Inherits the value from its parent element.

Browser support

This table shows when text-indent support started for each browser.

Chrome
1.0 Dec 2008
Firefox
1.0 Nov 2004
IE/Edge
3.0 Aug 1996
Opera
3.5 Nov 1998
Safari
1.0 Jun 2003

You may also like

Guides