W3docs

HTML <center> Tag

The <center> tag aligns the content to the center. Its equivalent in CSS is the text-align property. See examples.

The <center> tag is a block-level element, which means it can contain other block-level and inline elements. The content of the <center> tag (text, graphic elements, tables and so on) is aligned to the center.

Danger

The <center> is a deprecated HTML tag and not supported in HTML5. Instead, use the CSS text-align property which is applied to the <div> element or to <p>. When text-align: center is applied to <div> or <p>, the contents of these elements will be centered, but their total dimensions won’t change.

You can use the CSS margin-left and margin-right properties with auto values to center block-level elements.

Syntax

The <center> tag comes in pairs. The content is written between the opening (<center>) and closing (</center>) tags.

Alignment of the text|Example of the HTML <center> code|W3Docs

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>This text is aligned to the left.</p>
    <center>And this one is placed in the center.</center>
  </body>
</html>

Result

center example

Using CSS styles

As we’ve already mentioned, the <center> tag isn’t supported in HTML5. Instead, we use CSS styles.

Example with the CSS text-align property:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>This text is aligned to the left.</p>
    <p style="text-align:center">And this one is placed in the center.</p>
  </body>
</html>

Example with the CSS margin properties:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <div style="margin-left:auto; margin-right:auto; width:50%;">
      This block is centered.
    </div>
  </body>
</html>

Practice

Practice

Which statements are true regarding the HTML <center> tag?