HTML Cookbook Basic HTML Course

It's Easy!


Alternate Version

Letter Spacing

The CSS letter-spacing property allows us to change the spacing between letters, so you can stretch letters apart or pack them in close.


Letter-spacing Declaration

The declaration form for letter-spacing is:
letter-spacing: value

The values that may be used are normal or a length in any units that we have already discussed, such as px, pt or cm. Percentage (%) is not supported.

Length values may be positive or negative. Positive values move letters apart. Negative values move letters closer together. Normal is the same as 0 (zero). In other words, the value you use will add to or subtract from the normal distance between letters.


Styling for letter-spacing

Letter-spacing can be used in a style statement or as a class.

Sample Stylesheet
/* letter-spacing */
.spread { letter-spacing: 5pt; }
.close { letter-spacing:-2.5px; }


Sample Code
<p>With CSS, you can <span class="spread">spread letters apart</span> or <span class="close">move letters together</span>.</p>


Appears as:

With CSS, you can spread letters apart or move letters together.

PC Screenshot (white page)
PC Screenshot (black page)


WebTV Limitation

WebTV (MSNTV) does not support letter-spacing.

WebTV Solutions

Positive values for letter-spacing can simulated:


Assignment

Take some time to smell the roses or visit one of my websites.

Happy coding!
Gnubee

Links
Tips
Tools
References
Rules
HTML Help Gnubee - Newsgroup
HTML Course Contents (Home)

Valid XHTML 1.0!

Valid CSS!