The dominant-baseline property is used to determine or re-determine a scaled-baseline-table.

  • Initial valueauto
  • Applies toInline level elements
  • InheritedNo
  • MediaVisual
  • Computed valueSpecified value
  • AnimatableNo
  • CSS VersionCSS3
  • JavaScript syntaxobject.style.dominantBaseline
Formal syntax: auto | use-script | no-change | reset-size | alphabetic | hanging | ideographic | mathematical | central | middle | text-after-edge | text-before-edge

dominant-baseline: [value];
  • autoIf this property occurs on a block or inline-block element, then the user agent behavior depends on the value of the 'script' property. If the value of the script property is 'auto', the 'auto' value is equivalent to 'alphabetic' for horizontal 'writing-mode' values and 'central' for vertical 'writing-mode' values. If the value of the script property is other than 'auto', the 'auto' value is equivalent to 'use-script'
  • use-scriptThe dominant baseline-identifier is set using the computed value of the 'script' property. The 'writing-mode' value, whether horizontal or vertical is used to select the baseline-table that correspond to that baseline-identifier.
  • no-changeThe dominant baseline-identifier, the baseline-table and the baseline-table font-size remain the same as that of the parent.
  • reset-sizeThe dominant baseline-identifier and the baseline table remain the same, but the baseline-table font-size is changed to the value of the 'font-size' property on this element. This re-scales the baseline table for the current 'font-size'.
  • alphabeticThe dominant baseline-identifier is set to the 'alphabetic' baseline.
  • hangingThe dominant baseline-identifier is set to the 'hanging' baseline.
  • ideographicThe dominant baseline-identifier is set to the 'ideographic' baseline.
  • mathematicalThe dominant baseline-identifier is set to the 'mathematical' baseline.
  • centralThe dominant baseline-identifier is set to be 'central'. The derived baseline-table is constructed from the defined baselines in a baseline-table in the nominal font.
  • middleThe dominant baseline-identifier is set to be 'middle'. The derived baseline-table is constructed from the defined baselines in a baseline-table in the nominal font.
  • text-after-edgeThe dominant baseline-identifier is set to be 'text-after-edge'. The derived baseline-table is constructed from the defined baselines in a baseline-table in the nominal font.
  • text-before-edgeThe dominant baseline-identifier is set to be 'text-before-edge'. The derived baseline-table is constructed from the defined baselines in a baseline-table in the nominal font.

That font baseline-table is chosen using the following priority order of baseline-table names: 'alphabetic', 'ideographic', 'hanging' and 'mathematical'. The baseline-table is changed to the value of the 'font-size' property on this element.

.class {
   dominant-baseline: central; 
}
?Firefox?Explorer?Chrome?Safari?Opera


Last updated on 23rd March 2014 By Rene Spronk

View All CSS Properties

Errors? Please help to keep this list up to date, If you find any errors, please contact us, so that we can get them fixed.