horizontal text alignment


text-align: ***;

Browser
Internet Explorer Firefox Opera

The text-align property specifies the horizontal text alignment.


p {
text-align: center;
}


Property Value Explanation
text-align left aligns to the left
center aligns to the center
right aligns to the right
justify justifies the text

The justify value adjust the spaces between the words to justify both left and right side. (However, the last line is not justified.)


Example

Aligns to the left, center, and right

<html>
<head>
<title>TAG index</title>

<style type="text/css">

#example1 { text-align: left; }
#example2 { text-align: center; }
#example3 { text-align: right; }

</style>

</head>
<body>

<p id="example1">Aligns to the left</p>
<p id="example2">Aligns to the center</p>
<p id="example3">Aligns to the right</p>

</body>
</html>
Output

Aligns to the left

Aligns to the center

Aligns to the right


Justifies the text

<html>
<head>
<title>TAG index</title>

<style type="text/css">

#example4 {
width: 40%;
border: 1px #c0c0c0 solid;
text-align: left;
}

#example5 {
width: 40%;
border: 1px #c0c0c0 solid;
text-align: justify;
}

</style>

</head>
<body>

<p id="example4">This is example text ...</p>
<p id="example5">This is example text ...</p>

</body>
</html>
Output

This is example text. The text-align property specifies the horizontal text alignment. The justify value adjust the spaces between the words to justify both left and right side.

This is example text. The text-align property specifies the horizontal text alignment. The justify value adjust the spaces between the words to justify both left and right side.