Text Alignment

The default alignment for all elements, is left-aligned. The text-align property defines the horizontal text alignment for any HTML element:

HTML file: Displayed by browser:
<h1 style="text-align:center">Centered Heading</h1>

<p>This is a paragraph, with left alignment (default).</p>

<p style="text-align:right">This is a paragraph, with a right alignment.</p>

<p style="text-align:justify">Sometimes justified text looks good but sometimes, it does not! Drag to resize your browser window and watch how justified paragraphs change. This should remind you that every computer user has a screen that doesn't always match yours which could make your webpage look different to them, than it did to you. So it's important to write your HTML as simple as possible.</p>

Centered Heading

This is a paragraph, with left alignment (default).

This is a paragraph, with a right alignment.

Sometimes justified text looks good but sometimes, it does not! Drag to resize your browser window and watch how justified paragraphs change. This should remind you that every computer user has a screen that doesn't always match yours which could make your webpage look different to them, than it did to you. So it's important to write your HTML as simple as possible.

The old<center> tag is no longer valid in HTML5.

Back buttonTable of ContentsNext button