CSS Space Between Words
Space between words
If you want to add more space between the words of the paragraph, you can use the CSS “word-spacing” property. We can assign the values in pixels like 5px, 10px. If you can assign responsive values to word spacing properties like p.m, percentage(%), etc.
How to add Space between words
<html>
<head>
<title>Text shadow in CSS</title>
</head>
<style type="text/css">
.space{
text-align: justify;
word-spacing: 10px;
}
</style>
<body>
<p>Ut enim ad minim veniam,quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur. </p>
<p class=space>Ut enim ad minim veniam,quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
</body>
</html>Output:
In the above output, the second paragraph has 10px spacing between words. Because the word spacing value is set to 10px. You can also give any suitable value to the word-space property, there will add be space between the words. Even though the two paragraphs have the same font, but there are looking different by adding word spacing. We can not only use pixel value, we can use other units like points, em, etc. We know that 16px =1em, To convert pixels to em units, divide pixels by 16. for example we have pixels = 10, to convert em calculate 10 by 16, so the em value is 0.625.
