Skip to main content Link Search Menu Expand Document Toggle dark mode Copy Code (external link)
paperwork.help

text-indent : First Line Indent Property

The text-indent property indents the first line of a block of text. It is inherited, so setting it on a container indents the first line of each paragraph inside.

On this page

Usage

text-indent: 0;
text-indent: 24pt;
text-indent: 2em;
text-indent: 10%;

Values

  • length - An absolute or relative length: 24pt, 0.5in, 2em, 15mm.
  • percentage - A percentage of the width of the containing block: 10%.
  • 0 - No indent. This is the default.

A negative value is a hanging indent. The first line starts outside the left edge of the block, and the following lines (including any after a <br />) start at the edge. Make sure there is space, such as padding or a margin, for the first line to hang into.

Examples

<style>
    p.story { text-indent: 24pt; margin: 0; }
</style>

<p class="story">The first line of this paragraph is indented, and the following lines start at the left edge.</p>

Inherited from a container

<div style="text-indent: 1.5em">
    <p>Each paragraph in the div has its first line indented.</p>
    <p>And so does this one.</p>
</div>

Notes

  • Only the first line of the block is indented. Wrapped lines return to the left edge.
  • Inherited by child blocks. Set text-indent: 0 on a child to remove it.
  • A percentage is of the width of the containing block, not the width of the text.
  • The value can be set from data, for example text-indent: {{model.indent}}.
  • Added in Paperwork.Core 9.8. In earlier versions the property is ignored.

See Also