Spacing Letters and Words

Spacing Letters and Words

Another aspect of typography that CSS has picked up on is letter spacing and word spacing, handled by the letter-spacing and word-spacing properties, respectively. Values for each are lengths (see Example 9-8).

Example 9-8. Letter and word spacing

<p style="letter-spacing: 10px;">I married early, and was happy to find in my wife a
 disposition not uncongenial with my own. </p>
<p style="word-spacing: 0.5em;">Observing my partiality for domestic pets, she lost no
 opportunity of procuring those of the most agreeable kind. We had birds, gold fish, a fine
 dog, rabbits, a small monkey, and a cat.</p>

The first paragraph will have 10 pixels between each letter, and the second will have 0.5 ems between each word (see Figure 9-15).

The results are unusual. Although you wouldn't normally use these styles in conservative documents, you can begin to see how using such styles can provide sophisticated design options.