Center align text using CSS

Jun 6, 2021

Need to center some text? We've got your covered. This guide will walk you through center-aligning text using CSS.

Want to spruce up your CSS skills in general? Check out some of our other guides like this one on how to make a full-page background image using CSS or how to add text shadow.

text editor	×	1
browser	×	1

Howchoo is reader-supported. As an Amazon Associate, we may earn a small affiliate commission at no cost to you when you buy through our links.

The css property "text-align" can be applied to any HTML element containing text. For example:

<h1>Welcome!</h1>

Because h1 elements are display:block by default, the text can be aligned to the left, right or center. So adding

h1 {
    text-align: center;
}

This would center the heading "Welcome!" on the page.

Once you've straightened out your text, check out this guide to learn how to attach a CSS stylesheet to an HTML document.

NEXT UP

John (304)

Jun 6, 2021

2 minutes

Text shadows are a beautiful and subtle effect for your website. CSS3 text shadows are currently supported on all versions of Chrome, Safari, Firefox 3.5+, and IE 10+.

text-align:center;