word-spacing property is used to specify the spacing behavior between individual tags and words. The value specified will be added to the default space between these words. Don’t be confused by the term “word” in the
word-spacing property. It can be used on any kind of inline or inline-block content.
The initial value of CSS
word-spacing property is
normal. You can apply it to all elements. It also applies to
::first-line. This property can be inherited which means all elements that are children of a given element will also have the same value for
word-spacing property as the parent element. The final computed value of this property consists of an optimum, minimum, and maximum value, each consisting of either an absolute length, a percentage, or the keyword normal. This property is animatable as a length.
This is the formal syntax for using word-spacing property.
word-spacing: normal | <length> | inherit
Here are some examples of using this property.
/* Keyword value */ word-spacing: normal; /* <length> values */ word-spacing: 3px; word-spacing: 0.3em; /* <percentage> values */ word-spacing: 50%; word-spacing: 200%; /* Global values */ word-spacing: inherit; word-spacing: initial; word-spacing: unset;
This value indicates that the space between the words should be equal to the normal inter-word space, as defined by the current font and/or the browser.
This value is used to specify extra inter-word space in addition to the default space between words. Negative values are acceptable but there may be implementation-specific limits.
word-spacing property is supported in all major browsers like Chrome, Safari, Firefox, IE6+ and Opera, iOS and Android.
- Read more about the CSS
<word-spacing>property on MDN.
- You can also read the CSS
<word-spacing>property on CSSWG.
2. As a registered user, you will also get to access features like choosing between a light and dark theme or anything else that we might implement in future.