CSS Letter-Spacing Property



CSS Tutorial  >  Text  >  Letter-spacing

The letter-spacing property specifies the amount of space between letters. Possible values for this property are as follows:

  • "normal": this is the default value. The amount of space between letters is determined by the font type.
  • a length: This is a numerical value plus a length unit, and indicates the distance in relation to the default distance. A positive number means that there is more space between characters. A negative number means there is less space between characters.

Several examples are shown below:

Example 1: Positive letter-spacing value

CSS Declaration

p {
  letter-spacing: 8px;
}

The following HTML,

<p>8px added to the default distance between letters.</p>

renders

8px added to the default distance between letters.

In Example 1, the positive letter-spacing value causes the letters to spread out from one another.

Example 2: Negative letter-spacing value

CSS Declaration

p {
  letter-spacing: -0.05em;
}

The following HTML,

<p>-0.05em subtracted from the default distance between letters.</p>

renders

-0.05em subtracted from the default distance between letters.

In Example 2, the negative letter-spacing value causes the letters to be closer together.

Next: CSS Line-Height




Copyright © 2017   1keydata.com   All Rights Reserved   Privacy Policy   About   Contact