Text Alignment

The text-align property aligns text inside its element. Its values are:

• left: to the left (the default for languages written from left to right),
• right: to the right,
• center: to the center,
• justify: to both edges. The browser stretches the spaces between the words so that every line except the last one reaches from edge to edge.

This text is aligned to the left.

This text is aligned to the right.

This text is centered.

This text is justified. The browser stretches the spaces between the words so that every line except the last one reaches from one edge to the other, like in a newspaper.

Headings and paragraphs are usually as wide as the space they are in (on our page, the whole page), so center puts their text in the middle of the page. text-align is inherited: when you set it on an element, the text of all the elements inside it is aligned too.

Use justify with care: in narrow columns, the spaces between words can get very wide.