CSS text-indent Property

.example1 {
  text-indent: 50px;
}

.example2 {
  text-indent: 50%;
}

.example3 {
  text-indent: -1em;
}

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Meaning

The text-indent property specifies the indent in the first line of a block-level element.

Default value:	0
Inherited:	Yes
Animatable:	Yes
Version:	CSS3
JavaScript syntax:	`object.style.textIndent="length\|%\|each-line\|hanging\|initial\|inherit\|revert\|revert-layer\|unset";`

text-indent: length|%|each-line|hanging|initial|inherit|revert|revert-layer|unset;

The numbers in the table specify the first browser version that fully supports the property.

The following table describes the values of this property.

Value	Description
length	Default value is 0. Specifies a fixed indentation in px, pt, cm, em, etc. Negative length Values are allowed.
%(percentage)	Specifies the indentation in % of the width of the parent element. Negative percentage Values are allowed.
each-line	Indentation affects the first line of the block container as well as each line after a forced line break, but does not affect lines after a soft wrap break.
hanging	Inverts which lines are indented. All lines except the first line will be indented.
initial	Sets this property to its default value.
inherit	If specified, the associated element takes the computed value of its parent element animation-delay property.
revert	Reverts the cascaded value of the property from its current value to the value the property
revert-layer	Rollback styles to the ones specified in previous cascade layers.
unset	Resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not.

selectors {
  text-indent: 0;
}

The following example text-indent to 50px so paragraph will start 50px from left:

p {
  max-width:300px;
  border: 1px solid;
  padding: 10px;
  text-indent: 50px;
}