CSS letter-spacing Property

Description

The letter-spacing property defines the spacing between characters within an element. Browsers usually set the distance between characters based on the type and type of font, its size and the settings of the operating system. To change this value, this property is applied. It is acceptable to use a negative value, but in this case you need to make sure that the readability of the text is maintained.

Initial value

normal

Applies to

All elements

Inherited

Yes

Media

Visual

Computed value

An absolute length

Animatable

Yes

CSS Version

CSS1, CSS2, CSS3

JavaScript syntax

object.style.letterSpacing

Syntax

letter-spacing: normal | <length> 

Values

• normalNo additional spacing is applied.
• <length>Specifies additional spacing between characters. Values may be negative, but there may be implementation-dependent limits.
• inherit

Example

<p class="test">letter-spacing: -1px</p> 

<p class="test2">letter-spacing: normal</p> 

<p class="test3" >letter-spacing: 2px</p> 

<p class="test4">letter-spacing: 10px</p> 

.test {
   letter-spacing: -1px; 
}
.test2 {
   letter-spacing: normal;
}
.test3 {
   letter-spacing: 2px; 
}
.test4 {
   letter-spacing: 10px;
}

Browser Support

Desktop
4	12	1	1	3.5	1
Tablets / Mobile
≤37	18	4	10.1	1	1.0

Last updated by CSSPortal on: 3rd November 2019