Example of horizontally centering the content of a <div> with the text-align property:

Source Code: (back to article)

Result: Report an issue

<!DOCTYPE html>

<html>

<head>

<title>Title of the document</title>

<style>

div {

border: 3px solid lightblue;

height: 80px;

text-align: center;

padding-top:10px;

}

</style>

</head>

<body>

<h1>Horizontally aligned element</h1>

<div>

A horizontally aligned text with the CSS text-align property

</div>

</body>

</html>