CSS - text-align


Description:

The text-align property determines the way in which line boxes are aligned within a block-level element.

Possible Values:

  • left: The left edge of each line box is aligned with the left edge of the block-level element's content area.
  • right: The right edge of each line box is aligned with the right edge of the block-level element's content area.
  • center: The center of each line box is aligned with the center of the block-level element's content area.
  • justify: The edges of each line box should align with the edges of the block-level element's content area.
  • string: The content of cells in a column will align on the given string.

Applies to:

All the block-level elements (except the value <string>, which applies only to table cells)

DOM Syntax:

object.style.textAlign="justify";

Example:

Following is the example which demonstrates how to align a text:

<p style="text-align:right;">
This will be right aligned.
</p>
<p style="text-align:center;">
This will be center aligned.
</p>
<p style="text-align:left;">
This will be left aligned.
</p>
     

This will produce following result:

This will be right aligned.

This will be center aligned.

This will be left aligned.





Spacer Bottom Left Corner ImageBottom Right Corner Image
Valid XHTML 1.0 Strict  Valid CSS! Check the accessibility of this site according to U.S. Section 508