Widely availableSupported across all major browsers. Safe to use in production.
Typography Widely available

text-align

The text-align CSS property sets the horizontal placement of the inner content of a block element.

Typography

Overview

The text-align CSS property sets the horizontal placement of the inner content of a block element.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
text-align
1
12
1
1
18
1
center
1
79
1
≤4
18
≤3.2
end
1
79
1
3.1
18
2
justify
1
12
1
1
18
1
left
1
79
1
≤4
18
≤3.2
match-parent
16
79
40
15.4
18
15.4
right
1
79
1
≤4
18
≤3.2
start
1
79
1
3.1
18
2
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (79)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -moz- (1)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1.3)
  • Available with a vendor prefix: -khtml- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (18)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
  • Available with a vendor prefix: -khtml- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (79)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -moz- (1)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1.3)
  • Available with a vendor prefix: -khtml- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (18)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
  • Available with a vendor prefix: -khtml- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (79)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -moz- (1)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1.3)
  • Available with a vendor prefix: -khtml- (1)
Notes 1 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (18)
Notes 2 item(s)
Compatibility
  • Available with a vendor prefix: -webkit- (1)
  • Available with a vendor prefix: -khtml- (1)

Syntax

CSS 
.center { text-align: center; }
.justify { text-align: justify; }
.logical { text-align: start; }

Live demo

Center(center aligned)

CSS Center(center aligned) demo.

PreviewFullscreen

Justify(justify)

CSS Justify(justify) demo.

PreviewFullscreen

Right(right aligned)

CSS Right(right aligned) demo.

PreviewFullscreen

Use cases

  • Using text-align

    The text-align CSS property sets the horizontal placement of the inner content of a block element.

Cautions

  • May not be supported in older browsers.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links

Powered by web-features