How to center text in CSS?

In HTML, the <center> tag is used to center an element. The correct and modern way to center text is by using the CSS properties. It can be of the easiest task, but when we have more elements or large code, it can sometimes be confusing. The text-align property in CSS is responsible for the alignment of the text. 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.

Although the text-align property includes values like justify, center, right, left, initial, inherit, but using the center value, we can align the text to the center.

So, the text-align: center; is used for aligning the text to the center.

Syntax

Example

<html>  
   <head>  
   </head>  
<style>  
body{
text-align: center;
font-size: 25px;
}
h2{  
color: blue;  
}  
</style>  
   <body>  
   <h1>Example of text-align: center; </h1>  
        
   <h2> 
      text-align: center;  
      </h2>  
  <div>
  <p>Hello World</p>
  <p> Welcome to the javaTpoint.com </p>
  </div>
      </body>  
</html>  

Test it Now

Output