Typography

Text Indent

Utilities for controlling the amount of empty space shown before text in a block.

Basic usage

Adding a text indent

Use the indent-{width} utilities to set the amount of empty space (indentation) that's shown before text in a block.

So I started to walk into the water. I won't lie to you boys, I was terrified. But I pressed on, and as I made my way past the breakers a strange calm came over me. I don't know if it was divine intervention or the kinship of all living things but I tell you Jerry at that moment, I was a marine biologist.

<p className="**indent-8**">
  So I started to walk into the water. I won't lie to you boys, I was
  terrified. But I pressed on, and as I made my way past the breakers
  a strange calm came over me. I don't know if it was divine intervention
  or the kinship of all living things but I tell you Jerry at that moment,
  I <em>was</em> a marine biologist.
</p>

Using negative values

To use a negative text indent value, prefix the className name with a dash to convert it to a negative value.

<div className="**-indent-8**">
  So I started to walk into the water. I won't lie to...
</div>