Text Spacing & Alignment

Text Spacing

Horizontal Spacing
Example of Letter-spacing at .2em.
Example of normal Letter-spacing.
Example of Letter-spacing at -.2em.

Letter Spacing, Kerning, & Tracking

Vertical Spacing
Example of normal line-height.
Example of line-height at 4em.
em - a CSS unit that measures the size of a font, from the top of a font's cap height to the bottom of its lowest descender. Originally, the em was equal to the width of the capital letter M, which is where its name originated.

Text Alignment

Justification: This type of alignment makes the letter and word spacing automatically adjust so that each full line of text has a word or letter that lines up against the left and right edges of the text area.
text-alignment: This is the CSS setting that allows you to control the alignment of text. This property can be set to: right, left, center, and justified.

Example of Left Aligned:
Lorem ipsum dolor sit amet, eu nulla vel velit, torquent ante. In mauris fringilla est amet a. Dictum ultrices est ut in arcu, a rutrum est erat ornare vitae, ut justo nec diam phasellus, eu ut.

Example of Right Aligned:
Lorem ipsum dolor sit amet, eu nulla vel velit, torquent ante. In mauris fringilla est amet a. Dictum ultrices est ut in arcu, a rutrum est erat ornare vitae, ut justo nec diam phasellus, eu ut.

Example of Center Aligned:
Lorem ipsum dolor sit amet, eu nulla vel velit, torquent ante. In mauris fringilla est amet a. Dictum ultrices est ut in arcu, a rutrum est erat ornare vitae, ut justo nec diam phasellus, eu ut.

Example of Justify Align:
Lorem ipsum dolor sit amet, eu nulla vel velit, torquent ante. In mauris fringilla est amet a. Dictum ultrices est ut in arcu, a rutrum est erat ornare vitae, ut justo nec diam phasellus, eu ut.

Typetester