CSS Reference Property

letter-spacing 731h7

This property specifies the spacing behavior between individual letters in words of text. It is used to increase or decrease the default amount of space between the letters inside a word. 2ht71

The letter-spacing property is listed as an animatable property in the CSS Transitions spec, which means that you can transition its value from one to another using CSS transitions or animations. The speed at which the transition occurs is specified by a CSS timing function.

letter-spacing-example
Example of letter spacing with different values.

The letter-spacing property can be used to remove white space between inline-block elements inside an element by setting it to a value of -0.31em or 4px.

The letter-spacing property cascades, so you need to to reset the letter spacing value to normal on the inline-block elements if you don’t want them to inherit the same value as their container.

Official Syntax 2f2j3w

  • Syntax:
    letter-spacing: word-spacing: normal | <length> | inherit
  • Initial: normal
  • Applies To: all elements
  • Animatable: yes

Values 445h6m

normal
The spacing is the normal spacing for the current font. This value allows the agent to alter the space between characters in order to justify text.
<length>
This value indicates inter-character space in addition to the default space between characters. Values may be negative, but there may be implementation-specific limits. Browsers may not further increase or decrease the inter-character space in order to justify text.
inherit
The property takes the same specified value as the property for the element’s parent.

Examples 5w70f

The following rule increases the space between the letters inside the <blockquote> element by 0.1em.

blockquote {
    letter-spacing: 0.1em;
}
                

Browser 51c73

The letter-spacing property is ed in Chrome, Firefox, Safari, Opera and IE4+, Android and iOS.

Notes 6p2z1x

Details on mobile is available in the mobile compatibility table on QuirksMode.

Further Reading 375l1b

Written by

Last updated June 4, 2020 at 3:33 pm by Mary Lou

Do you have a suggestion, question or want to contribute? Submit an issue.