This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

text-height

Summary

This property helps determine an inline box’s block-progression dimension, derived from the text-height and font-size properties for non-replaced elements, the height or the width for replaced elements, and the stacked block-progression dimension for inline-block elements. The block-progression dimension determines the position of the padding, border and margin for the element.

Overview table

Initial value
auto
Applies to
Inline elements and parents of elements with display:ruby-text.
Inherited
Yes
Media
visual
Computed value
As specified, except for initial and inherit
Animatable
No

CSS Object Model Property
:

Percentages
N/A

Syntax

  • text-height: <number>
  • text-height: auto
  • text-height: font-size
  • text-height: max-size
  • text-height: text-size

Values

auto
The block-progression dimension is based either on the em square determined by the computed element font-size property value, or the cell-height (ascender + descender) related to the computed element font-size as chosen by the user agent.
font-size
The block-progression dimension is based on the em square as determined by the computed element font-size.
text-size
The block-progression dimension is based on the cell-height (ascender + descender) related to the computed element font-size.
max-size
The block-progression dimension is based on the maximum extents toward the before-edge and after-edge of the box (obtained by considering all child elements located on the same line), ruby annotations (elements with “display:ruby-text”), and baseline shifted elements.
<number>
The block progression dimension is based on number times the em square as determined by the computed font-size.

Examples

/* auto */
.inlinebox { text-height: auto; }

/* font-size */
.inlinebox { text-height: font-size; }

/* number */
.inlinebox { text-height: 3; }

Related specifications

CSS Line Layout Module
W3C Editor’s Draft