How to center align text in HTML & CSS

You can center text in HTML by setting the text-align property to center.

Center Text in HTML & CSS

To start of you should have some HTML content you want to center.

<p>Text content that you want to center on a web page</p>

To center the text above, use CSS.

p {
  text-align: center;
}

Result

Text content that you want to center on a web page

Using CSS class

You can also create a CSS class that you can use to selectively center text instead of centering all paragraphs.

HTML Code

<p>Text content that you want to center on a web page</p>

CSS Code

.text-center {
  text-align: center;
}

Result

Text content that you want to center on a web page

Using CSS ID

You can also target a specific paragraph using an id.

#tagline {
  text-align: center;
}

Result

Text content that you want to center on a web page

Using Inline CSS

Finally, you can also use inline CSS to center text.

<p style="text-align:center;">Text content that you want to center on a web page</p>

Result

Text content that you want to center on a web page