Home » Wiki Tutorials » CSS , Web Design , Graphic & Design »

How to Adjust space between words and letters

text size: T | T Related software / service: CSS

Problem

When you’re designing web pages using CSS, you may find the space between words and letters of the text are not appropriate. How can you adjust space between words and letters? Please see the solution.

Solution

In order to adjust space between words and letters, you can use word-spacing and letter-spacing properties.

Create an html file with the following codes:
<html>
<head>
</head>
<body>
<p class='s1'>Adjust space between words</p>
<p class='s2'>Adjust space between letters</p>
</body>
</html>

The effect will be like as below:

Adjust space between words and letters
In order to adjust space between words, use the following CSS codes.
p.s1{word-spacing:10px}

In order to adjust space between letters, use the following CSS codes.
p.s2{letter-spacing:3px}

So add the entire CSS codes between <head> and <head>.
<style>
p.s1{word-spacing:10px}
p.s2{letter-spacing:3px}
</style>

The effect will be like as below:

Adjust space between words and letters