CSS text-align Property

How to use CSS text-align property

The text-align property sets the horizontal alignment of the text. The example below aligns the <p> element start, end, left, right, center, justify, justify-all, or match-parent all the specified text.

HTML

<p class="example">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis faucibus lacinia malesuada. 
</p>

CSS

.example {
  text-align: start;
}

Most common values

/* Keyword values */
text-align: start;
text-align: end;
text-align: left;
text-align: right;
text-align: center;
text-align: justify;
text-align: justify-all;
text-align: match-parent;
/* Global values */
text-align: inherit;
text-align: initial;
text-align: revert;
text-align: revert-layer;
text-align: unset;

Simon Urbina

Simon is a Product Designer and Front End Dev with over 20 years of experience. He started as a graphic designer and illustrator coding his first website in 1996. He has worked with brands like Publix, Microsoft, and Discovery Channel.

Twitter