← TechnologyThe essentials of

text-underline-offset

Publisher: ResumeMaker • 1 source

Published: 22 Oct 2026 13:13 · Updated: 22 Oct 2026 13:13

AI source check: 21 Oct 2026 13:48. This is not editorial approval.

In a few sentences

In brief

The distance of the line is separate from the height of the text line.

Useful to know

text-underline-offset sets the offset of the highlighting line to its original position. It is not a setting for all types of decorations: the crossing and the top line do not get the same effect. [1]

Example: a { text-underline-offset: 0.2em; }. The em unit links the distance to the font size. If you increase the value too much, the relationship between the text and the line may become unclear . line-height controls the height of the line and is not a substitute. Review letters with underparts and several adjacent lines to select a readable result.

Sources

For further detail and to check the information:

  1. [1] MDN — text-underline-offset ↗