dominant-baseline property CSS Reference



Definition and Usage

The 'dominant-baseline' property is used to determine or re-determine a scaled-baseline-table. A scaled-baseline-table is a compound value with three components:

  • a baseline-identifier for the dominant baseline; it can be qualified as the 'dominant' baseline-identifier (or 'dominant baseline' in short); the baseline-identifier is basically an ''alignment-baseline'' value.
  • a derived baseline-table which contains definition for additional baseline-identifiers related to various scripts,
  • and a baseline-table font-size.
Name: dominant-baseline
Value: auto | use-script | no-change | reset-size | alphabetic | hanging | ideographic |
mathematical | central | middle | text-after-edge | text-before-edge
Initial: auto
Applies to: inline-level elements (but see prose)
Inherited: no
Percentages: N/A
Media: visual
Computed value: specified value (except for initial and inherit)

Syntax

dominant-baseline : auto | use-script | no-change | reset-size | alphabetic | hanging | ideographic | mathematical | central | middle | text-after-edge | text-before-edge

Values

auto
If 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'
Otherwise, if this property occurs on an inline-level element, then the baseline-identifier and the baseline-table components remain the same as those of the parent element. The baseline-table font-size also remains the same as the parent's one, unless the computed 'baseline-shift' value actually shifts the baseline; then the baseline-table font-size is set to the value of the 'font-size' property on this element. If there is no parent element, the dominant-baseline components are set as for the block elements.
use-script
The 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. The baseline-table font-size component is set to the value of the 'font-size' property on this element.
no-change
The dominant baseline-identifier, the baseline-table and the baseline-table font-size remain the same as that of the parent.
reset-size
The 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'.
alphabetic
The dominant baseline-identifier is set to the 'alphabetic' baseline, the derived baseline-table is constructed using the 'alphabetic' baseline-table in the nominal font, and the baseline-table font-size is changed to the value of the 'font-size' property on this element. (The 'alphabetic' baseline is the standard baseline for Roman scripts.)
hanging
The dominant baseline-identifier is set to the 'hanging' baseline, the derived baseline- table is constructed using the 'hanging' baseline-table in the nominal font, and the baseline-table font-size is changed to the value of the 'font-size' property on this element.
ideographic
The dominant baseline-identifier is set to the 'ideographic' baseline, the derived baseline- table is constructed using the 'ideographic' baseline-table in the nominal font, and the baseline-table font-size is changed to the value of the 'font-size' property on this element.
mathematical
The dominant baseline-identifier is set to the 'mathematical' baseline, the derived baseline- table is constructed using the 'mathematical' baseline-table in the nominal font, and the baseline-table font-size is changed to the value of the 'font-size' property on this element.
central
The 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. That font baseline-table is chosen using the following priority order of baseline-table names: 'ideographic', 'alphabetic', 'hanging' and 'mathematical'. The baseline-table is changed to the value of the 'font-size' property on this element.
middle
The 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. 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.
text-after-edge
The 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. 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.
text-before-edge
The 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.

Examples

.class {
    dominant-baseline: central ;
}

Relative articles