CSS text-indent Property

CSS text-indent property is used to indent the very first line of the text. Indentation simply means, setting an empty space before that particular line of the text.

The indentation value can be specified in any valid CSS length formats like ‘px’, ’em’, ‘rem’, ‘%’, etc. See the example below:

Example:

.p1{
  text-indent: 40px;
}
.p2{
  text-indent: 2em;
}
.p3{
  text-indent: 20%;
}

CSS Syntax

The text-indent property has the following syntax:

text-indent: length|percentage|initial|inherit;

Property Values

The text-indent property accepts the following values:

lengthSpecifies a fixed empty space at the very beginning of the first line of the text. It accepts value in CSS fixed length formats like ‘px’, ’em’, ‘cm’, ‘rem’, etc. The default value is zero(0).
percentageDefines a dynamic indentation in percentage(%).
initialSets the text-indent property to its default value(zero).
inheritInherits the text-indent property from the parent element.

General Info

Default Valuezero(0)
InheritedYes
JavaScript Usageelement.style.textIndent = “40px”

Author

  • Manoj Kumar

    Hi, My name is Manoj Kumar. I am a full-stack developer with a passion for creating robust and efficient web applications. I have hands-on experience with a diverse set of technologies, including but not limited to HTML, CSS, JavaScript, TypeScript, Angular, Node.js, Express, React, and MongoDB.

    View all posts