CSS text-align

This CSS property is used to set the horizontal alignment of a table-cell box or the block element. It is similar to the vertical-align property but in the horizontal direction.

Syntax

Possible values

justify: It is generally used in newspapers and magazines. It stretches the element's content in order to display the equal width of every line.

center: It centers the inline text.

right: It is used to align the text to the right.

left: It is used to align the text to the left.

Let's see an example that will demonstrate the text-align property.

Example

<html>
   <head>
   </head>
<style>
h2{
color: blue;
}
</style>
   <body>
   <h1>Example of text-align proeprty</h1>
	  
   <h2 style = "text-align: center;">
         text-align: center;
      </h2>
      
      <h2 style = "text-align: right;">
		 text-align: right;
      </h2>
      
      <h2 style = "text-align: left;">
          text-align: left;
      </h2>
      <h2 style = "text-align: justify;">
          text-align: justify; To see its effect, it should be applied on large paragraph.
      </h2>

	  </body>
</html>

Test it Now

Next TopicCSS Variables

← prev next →