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 −

Live Demo

<html>
   <head>
   </head>

   <body>
      <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>
   </body>
</html>

This will produce following result −