CSS Property text-align








text-align sets the horizontal alignment of text.

Summary

ItemValue
Initial value left if direction is ltr, and right if direction is rtl
Inherited Yes.
Version CSS1
JavaScript syntax object.style.textAlign="right"
Applies to Block-level elements.

CSS Syntax

text-align: center | justify | left | right | inherit 




Property Values

The property values are listed in the following table.

Value Description
left Align the text to the left
right Align the text to the right
center Center the text
justify justify to make line to have same width
inherit inherit the text-align property from the parent element

Browser compatibility

text-align Yes Yes Yes Yes Yes




Example

An example showing how to use text-align CSS property.

<!DOCTYPE HTML>
<html>
<head>
  <style>
    table {<!--   w  w  w  .j a  v a2s  .c  o  m-->
      width: 500px;
    }
    td.leftAlign {
      text-align: left;
    }
    td.rightAlign {
      text-align: right;
    }
    td.center {
      text-align: center;
    }
    td.justify {
      text-align: justify;
    }
  </style>
</head>
<body>
<table>
  <tr><td class="leftAlign">Here is some text</td></tr>
  <tr><td class="rightAlign">Here is some text</td></tr>
  <tr><td class="center">Here is some text</td></tr>
  <tr><td class="justify">Here is some text</td></tr>
</table>
</body>
</html>

Click to view the demo