Values

auto (by default)

For each glyph corresponding to textual information within the element, the alignment-point is the intersection of the start-edge of the glyph box and the block-progression-direction position of the alignment point from the font. Padding, border or margin do not affect that alignment point. The alignment point of the inline-level element itself is at the intersection of the start-edge of the first inline box and the baseline identified by the alignment-baseline property if this baseline exists in the baseline-table for the element dominant-baseline. If that specific baseline does not exist, the user agent may use heuristics to determine where that missing baseline would be. For other inline box content like images, the user agent will use heuristics to determine the position of the alignment point. For example when the resulting baseline is alphabetic or ideographic, it is expected that the alignment point will be at the intersection of the start-edge and the after-edge of the inline box, including its respective margin. If the resulting baseline is hanging, the intersection of the start-edge and the before-edge of the inline box, including its respective margin should be used instead.

When the alignment-baseline property is set to either after-edge or before-edge, the auto value is equivalent to after-edge or before-edge respectively.

baseline

The alignment point is at the intersection of the start-edge of the element and the dominant-baseline of the element.

before-edge

The alignment point is at the intersection of the start-edge of the element and the before-edge of the extended inline box of the element. This may include or not the line-height of the element, depending on the line-stacking-strategy.

text-before-edge

The alignment point is at the intersection of the start-edge of the element and the text-before-edge baseline of the element.

central

The alignment point is at the intersection of the start-edge of the element and the central baseline of the element.

middle

The alignment point is at the intersection of the start-edge of the element and the middle baseline of the element.

after-edge

The alignment point is at the intersection of the start-edge of the element and the after-edge of the extended inline box of the element. This may include or not the line-height of the element, depending on the line-stacking-strategy.

text-after-edge

The alignment point is at the intersection of the start-edge of the element and the text-after-edge baseline of the element.

ideographic

The alignment point is at the intersection of the start-edge of the element and the ideographic baseline of the element.

alphabetic

The alignment point is at the intersection of the start-edge of the element and the alphabetic baseline of the element.

hanging

The alignment point is at the intersection of the start-edge of the element and the hanging baseline of the element.

mathematical

The alignment point is at the intersection of the start-edge of the element and the mathematical baseline of the element.

<percentage>

The computed value of the property is this percentage multiplied by the computed line-height of the element. The alignment point is on the start-edge of the inline box. Its position along the start-edge relative to the intersection of the dominant-baseline and the start-edge is offset by the computed value. The offset is opposite to the shift-direction (positive value) or in the shift-direction (negative value). A value of 0% makes the dominant-baseline the alignment point.

<length>

The alignment-point is on the start-edge of the inline box. Its position along the start-edge relative to the intersection of the dominant-baseline and the start-edge is offset by the <length> value. The offset is opposite to the shift-direction (positive value) or in the shift-direction (negative value). A value of 0cm makes the dominant-baseline the alignment point.