How to center text in CSS

In HTML, the <center> tag is employed to align an element at the center. The appropriate and contemporary method to center text involves utilizing CSS attributes. While aligning text may seem straightforward, it can become perplexing with numerous elements or extensive code. The text-align attribute in CSS dictates the alignment of text, specifically setting the horizontal alignment of a table-cell box or a block element. It functions similarly to the vertical-align attribute but focuses on horizontal alignment.

While the text-align property offers options such as justify, center, right, left, initial, and inherit, opting for the center value enables aligning the text in the middle.

So, applying text-align: center; aligns the text in the middle.

Syntax

Example


text-align: center;

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 C# Tutorial </p>

  </div>

      </body>  

</html>

Output

Syntax

Example

Input Required