The text-align property

The text-align property sets a text alignment: to the left, right, center, left and right edges simultaneously.

Syntax

cssselector {
  text-align: center | left | right | justify | auto | start | end;
}

Values

Value Description
center A text will be centered.
left A text will be aligned to the left.
right A text will be aligned to the right.
justify A text will be aligned both to the right and left edges at the same time.
auto Does not change element alignment (default).
start Equal to left if the text goes from left to right, and right when the text goes from right to left (Arabic, etc.).
end Equal to right if the text goes from left to right and left when the text goes from right to left.

Default value: auto. In most cases, by default, text is left-aligned (right-aligned in Arabic). However, there are exceptions, for example, the text in th will be centered.

Example . The left value

html<p>
  some long text
</p>
cssp {
  text-align: left;
  width: 400px;
}

Результат:

Example . The right value

html<p>
  some long text
</p>
cssp {
  text-align: right;
  width: 400px;
}

Результат:

Example . The center value

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  text-align: center;
}

Результат:

Example . The justify value

html<p>
  some long text
</p>
cssp {
  text-align: justify;
  width: 400px;
}

Результат: