Align Content by Column

The alignment operators allow you to horizontally and vertically align a column’s content. They’re applied to a column specifier and assigned to the cols attribute.

Horizontal alignment operators

Content can be horizontally aligned to the left or right side of the column as well as the center of the column.

Flush left operator (<): The less-than sign (<) left aligns the content. This is the default horizontal alignment.
Flush right operator (>): The greater-than sign (>) right aligns the content.
Center operator (^): The caret (^) centers the content.

A horizontal alignment operator is entered in front a vertical alignment operator (if present) and in front of a column’s width (if present). If the number of columns is assigned using a multiplier (<n>*), the horizontal alignment operator is placed directly after the multiplier operator (*).

[cols="2,^1"] A horizontal alignment operator is placed in front of the column width.
[cols=">.^1,2"] A horizontal alignment operator is placed in front of a vertical alignment operator.
[cols=">,^"] When a column width isn’t specified, a horizontal alignment operator can represent both the column and the column content’s alignment.
[cols="3*>"] The horizontal alignment operator is placed directly after a multiplier.

Center content horizontally in a column

To horizontally center the content in a column, place the ^ operator at the beginning of the column’s specifier.

Example 1. Center column content horizontally

[cols="^4,1"]
|===
|This content is horizontally centered.
|There isn't a horizontal alignment operator on this column's specifier, so the column falls back to the default horizontal alignment.
Content is left-aligned by default.
|===

The table from Example 1 is rendered below.

Result of Example 1
This content is horizontally centered.	There isn’t a horizontal alignment operator on this column’s specifier, so the column falls back to the default horizontal alignment. Content is left-aligned by default.

When the columns are specified using the multiplier, place the ^ operator after the multiplier operator (*).

Example 2. Horizontal alignment and multiplier operator order

[cols="2*^",options=header]
|===
|Column name
|Column name

|This content is horizontally centered.
|This content is also horizontally centered.
|===

The table from Example 2 is rendered below.

Result of Example 2
Column name	Column name
This content is horizontally centered.	This content is also horizontally centered.

Right align content in a column

To align the content in a column to its right side, place the > operator in front of the column’s specifier.

Example 3. Right align column content

[cols=">4,1"]
|===
|This content is aligned to the right side of the column.
|There isn't a horizontal alignment operator on this column's specifier, so the column falls back to the default horizontal alignment.
Content is left-aligned by default.
|===

The table Example 3 is rendered below.

Result of Example 3
This content is aligned to the right side of the column.	There isn’t a horizontal alignment operator on this column’s specifier, so the column falls back to the default horizontal alignment. Content is left-aligned by default.

When the columns are specified using the multiplier, place the > operator after the multiplier operator (*).

Example 4. Right alignment and multiplier operator order

[cols="2*>",options=header]
|===
|Column name
|Column name

|This content is aligned to the right side of the column.
|This content is also aligned to the right side of the column.
|===

The table from Example 4 is rendered below.

Result of Example 4
Column name	Column name
This content is aligned to the right side of the column.	This content is also aligned to the right side of the column.

Vertical alignment operators

Content can be vertically aligned to the top or bottom of a column’s cells as well as the center of a column. Vertical alignment operators always begin with a dot (.).

Flush top operator (.<): The dot and less-than sign (.<) aligns the content to the top of the column’s cells. This is the default vertical alignment.
Flush bottom operator (.>): The dot and greater-than sign (.>) aligns the content to the bottom of the column’s cells.
Center operator (.^): The dot and caret (.^) centers the content vertically.

A vertical alignment operator is entered directly after a horizontal alignment operator (if present) and before a column’s width (if present). If the number of columns is assigned using a multiplier (<n>*), the vertical alignment operator is placed directly after the horizontal alignment operator (if present). Otherwise, it’s placed directly after the multiplier operator (*).

[cols="2,.^1"] A vertical alignment operator is placed in front of the column width.
[cols=">.^1,2"] The vertical alignment operator is placed after the horizontal alignment operator but before the column width.
[cols=".^,.>"] When a column width doesn’t need to be specified, a vertical alignment operator can represent both the column and the column content’s alignment.
[cols="3*.>"] The vertical alignment operator is placed directly after a multiplier unless there is a horizontal alignment operator. Then it’s placed after the horizontal alignment operator, (e.g., [cols="3*^.>"])

Align content to the bottom of a column’s cells

To align the content in a column to the bottom of each cell, place the .> operator directly in front of the column’s width.

Example 5. Bottom align column content

[cols=".>2,1"]
|===
|This content is vertically aligned to the bottom of the cell.
|There isn't a vertical alignment operator on this column's specifier, so the column falls back to the default vertical alignment.
Content is top-aligned by default.
|===

The table from Example 5 is rendered below.

Result of Example 5
This content is vertically aligned to the bottom of the cell.	There isn’t a vertical alignment operator on this column’s specifier, so the column falls back to the default vertical alignment. Content is top-aligned by default.

Center content vertically in a column

To vertically center the content in a column, place the .^ operator directly in front of the column’s width.

Example 6. Center column content vertically

[cols=".^2,1"]
|===
|This content is centered vertically in the cell.
|There isn't a vertical alignment operator on this column's specifier, so the column falls back to the default vertical alignment.
Content is top-aligned by default.
|===

The table from Example 6 is rendered below.

Result of Example 6
This content is centered vertically in the cell.	There isn’t a vertical alignment operator on this column’s specifier, so the column falls back to the default vertical alignment. Content is top-aligned by default.

To vertically align the content to the middle of the cells in all of the columns, enter the .^ operator after the multiplier.

Example 7. Vertical alignment and multiplier operator order

[cols="2*.^",options=header]
|===
|Column name
|Column name

|This content is vertically centered.
|This content is also vertically centered.
|===

The table from Example 7 is rendered below.

Result of Example 7
Column name	Column name
This content is centered vertically in the cell.	This content is also centered vertically in the cell.

When a horizontal alignment operator is also applied to the multiplier, then the vertical alignment operator is placed directly after the horizontal operator (e.g., [cols="2*>.^"]).

Apply horizontal and vertical alignment operators to the same column

A column can have a vertical and horizontal alignment operator placed on its specifier. The horizontal operator always precedes the vertical operator. Both operators precede the column width. When a multiplier is used, the operators are placed after the multiplier.

Example 8. Horizontally and vertically align column content

[cols="^.>2,1,>.^1"]
|===
|Column name |Column name |Column name

|This content is centered horizontally and aligned to the bottom
of the cell.
|There aren't any alignment operators on this column's specifier,
so the column falls back to the default alignments.
The default horizontal alignment is left-aligned.
The default vertical alignment is top-aligned.
|This content is aligned to the right side of the cell and
centered vertically.
|===

The table from Example 8 is rendered below.

Result of Example 8
Column name	Column name	Column name
This content is centered horizontally and aligned to the bottom of the cell.	There aren’t any alignment operators on this column’s specifier, so the column falls back to the default alignments. The default horizontal alignment is left-aligned. The default vertical alignment is top-aligned.	This content is aligned to the right side of the cell and centered vertically.

If there is an alignment operator on a cell’s specifier, it will override the column’s alignment operator.