bugl
bugl
HomeLearnPatternsSearch
HomeLearnPatternsSearch

Loading lesson path

Learn/CSS/CSS Foundations
CSS•CSS Foundations

CSS Table Alignment

Horizontal Alignment

The CSS

Formula

text - align property is used to set the horizontal alignment of the content in < th > or < td >.

This property can have one of the following values: left - Aligns the text to the left right - Aligns the text to the right center - Centers the text

Note:

Formula

By default, the content of < th > elements are center - aligned and the content of < td > elements are left - aligned!

CSS text-align: center

Formula

To center - align the content of < td > elements, use text - align: center

Firstname

Lastname

Savings

Peter

Griffin

$100

Lois

Griffin

$150

Joe

Swanson

$300

Example

Formula

Center - align < td > elements:

td

{
text-align: center;
}

CSS text-align: left

Formula

To force the content of < th > elements to be left - aligned, use text - align: left on < th >

elements:

Firstname

Lastname

Savings

Peter

Griffin

$100

Lois

Griffin

$150

Joe

Swanson

$300

Previous

CSS Table Size (Width and Height)

Next

CSS Table Styling