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

Overview

The dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
1
79
1
4
18
3.2
alphabetic
1
79
1
4
18
3.2
auto
1
79
1
4
18
3.2
central
1
79
1
4
18
3.2
hanging
1
79
1
4
18
3.2
ideographic
1
79
1
4
18
3.2
mathematical
1
79
1
4
18
3.2
middle
1
79
1
4
18
3.2
1+Supported (version) Not supported Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

CSS
text {
  dominant-baseline: central;
}
.math-text {
  dominant-baseline: mathematical;
}

Live demo

central

CSS Central demo.

PreviewFullscreen

mathematical

CSS Mathematical demo.

PreviewFullscreen

hanging

CSS Hanging demo.

PreviewFullscreen

Use cases

  • Using dominant-baseline

    The dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.

Cautions

  • May not be supported in older browsers.

Accessibility

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

Powered by web-features