HTML align Attribute

The obsolete HTML align attribute was historically used to control the horizontal or vertical alignment of text, images, tables, and other content. Its behavior and supported values depended on the HTML element where it was used.

Historical Syntax

The align attribute was added directly to an HTML element. The following example shows how it was historically used to center paragraph text:

<p align="center">Centered paragraph text</p>

Depending on the element, historical values included left, center, right, justify, top, middle, and bottom. Not every value was supported by every element.

Historical Elements

The align attribute was historically used with many HTML elements. Its purpose changed depending on the element.

Elements Historical Purpose
<caption>, <div>, <h1>-<h6>, <p> Aligned text or other content.
<col>, <tbody>, <thead>, <tfoot>, <td>, <th>, <tr> Controlled the horizontal alignment of table content.
<embed>, <iframe>, <img>, <input>, <object> Controlled the position or alignment of an element relative to surrounding content.
<hr>, <table> Controlled the horizontal position of the element.
<legend> Controlled the alignment or position of the legend within a fieldset.

Historical Use

Before CSS became the standard way to control webpage presentation, the align attribute provided a convenient way to position and align content directly in HTML.

Its meaning was not consistent across all elements. For example, align="center" could center text inside a paragraph, while values used with an image could affect how the image was positioned relative to nearby text.

Why It Became Obsolete

The align attribute mixed presentation with the structural purpose of HTML. Modern webpages separate these responsibilities by using HTML to describe content and CSS to control its appearance and layout.

Because the historical align attribute performed several different jobs, there is no single CSS property that replaces every use of it. The appropriate CSS depends on what is being aligned.

Modern Alternative

Use CSS to control alignment in modern webpages. For text and inline content, the text-align property can be used instead of the historical align attribute.

Historical HTML

<p align="center">Centered paragraph text</p>

Modern HTML and CSS

<p class="center-text">Centered paragraph text</p>

<style>
.center-text {
  text-align: center;
}
</style>

The correct CSS technique depends on the type of alignment required. The text-align property controls the horizontal alignment of inline content. The vertical-align property is useful in specific situations such as table cells and inline-level elements. Margins can be used for some types of block-level centering, while Flexbox and Grid provide powerful alignment tools for modern layouts.

Play in Editor

Learn More About CSS Alignment

The CSS tutorials provide more information about the different techniques used to align and position content:

  • CSS Text Alignment - Control the horizontal alignment of text and inline content.
  • CSS Vertical Alignment - Learn how vertical alignment works with inline content and table cells.
  • CSS Centering Elements - Learn modern techniques for centering webpage elements.
  • CSS Float & Clear - Learn how floating elements can affect the flow of surrounding content.
  • CSS Flexbox - Learn the fundamentals of creating flexible layouts with CSS Flexbox.
  • CSS Grid - Learn the fundamentals of creating two-dimensional layouts with CSS Grid.

Legacy Browser Support

The obsolete align attribute was implemented by older browsers on many HTML elements, although its behavior and supported values depended on the element where it was used. Some browsers may still recognize certain historical uses for compatibility with older webpages.

Browser recognition of the align attribute does not make it valid modern HTML. When maintaining older source code, replace the attribute with the CSS property or layout technique appropriate for the element and the type of alignment required.

For additional information about historical browser compatibility, visit Can I Use? . Search for the HTML element or attribute you want to check. Search results can include related HTML features, element attributes, APIs, and other technologies, so select the result that most closely matches the legacy feature you are researching.

Other obsolete presentational HTML attributes include:

  • bgcolor - Historically used to set a background color.
  • border - Historically used to control borders on certain elements.
  • hspace - Historically used to add horizontal space around certain elements.
  • valign - Historically used to control vertical alignment.
  • vspace - Historically used to add vertical space around certain elements.

Specifications

The align attribute is listed among obsolete and non-conforming features in the WHATWG HTML Living Standard .