You are here: Reference > CSS > properties > text-underline-position

text-underline-position property

Browser support:
Specifies the position of the underline decoration.
This property offers a refinement for underlined text content.
For a cross-browser solution, use text-decoration property to change whether the element is underlined or overlined.
The text-underline-position property has effect only if the value of the text-decoration property is set to 'underline'.
JavaScript page for this property: textUnderlinePosition. You can find other example(s) there.

Possible values:

 One of the following values: 
Underline is above the text.
Underline is below the text, or above if lang attribute is set to 'ja' (japanese) and writing-mode property is set to 'tb-rl'.
Same as auto. IE6 and later.
Underline is below the text.
Default: auto.

Example HTML code 1:

This example illustrates the use of the text-underline-position property:
        .example {
            text-decoration: underline;
            text-underline-position: above;
    <p id="sample" class="example">text underline position</p>
Did you find this example helpful? yes no

Supported by tags:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content