Line & Letter Spacing in CSS

1. Line Height

The line-height property sets the vertical spacing between lines of text.

p {
    line-height: 1.6;
}
            

You can use unitless values (recommended), or fixed units like px or em.

2. Letter Spacing

The letter-spacing property adjusts the space between characters.

h1 {
    letter-spacing: 2px;
}
            

You can use positive values to spread characters or negative values to bring them closer.

3. Word Spacing

The word-spacing property adds space between words.

p.intro {
    word-spacing: 5px;
}
            

4. Practical Example

p.readable-text {
    font-size: 18px;
    line-height: 1.75;
    letter-spacing: 0.5px;
    word-spacing: 2px;
}
            

This improves the overall readability of paragraph text.

Conclusion

Adjusting line height, letter spacing, and word spacing gives you finer control over typography and layout. Use these properties to create clean and readable text blocks.