This site is 📱 accessible. Tap here to use the mobile stylesheet. Click Me!

4.1.4 Text Spacing

Text Indentation

The text-indent property is used to specify the indentation of the first line of a text:

Example 1 - Text Indentation

p {
  text-indent: 50px;
}

Letter Spacing

The letter-spacing property is used to specify the space between the characters in a text. The following example demonstrates how to increase or decrease the space between characters:

Example 2 - Letter Spacing

h1 {
  letter-spacing: 5px;
}

h2 {
  letter-spacing: -1px;
}

Line Height

The line-height property is used to specify the space between lines:

Example 3 - Line Height

p.small {
  line-height: 0.8;
}

p.big {
  line-height: 1.8;
}

Word Spacing

The word-spacing property is used to specify the space between the words in a text. The following example demonstrates how to increase or decrease the space between words:

Example 4 - Word Spacing

h1 {
  word-spacing: 10px;
}

h2 {
  word-spacing: -2px;
}

White Space

The white-space property specifies how white-space inside an element is handled.

Example 5 - White Space

This example demonstrates how to disable text wrapping inside an element:

p {
  white-space: nowrap;
}