A propriedade CSS text-underline-position

Definição e uso

text-underline-position O atributo especifica a posição da decoração de sublinhatura do texto.

Defina a posição da decoração de sublinhatura do texto:

div.a {
  text-decoration: underline;
  text-underline-position: auto;
}
div.b {
  text-decoration: underline;
  text-underline-position: under;
}

text-underline-position: auto|under|from-font|left|right|initial|inherit;

Valor	Descrição
auto	Valor padrão. O navegador define a posição da sublinhatura.
under	Posicione a sublinhatura abaixo da base do caractere.
from-font	Se o arquivo de fonte contiver informações sobre a posição da sublinhatura, use esse valor. Caso contrário, use auto.
esquerda	No modo de escrita vertical, a sublinhatura será posicionada à esquerda do texto. No modo de escrita horizontal, a sublinhatura será posicionada conforme auto.
direita	No modo de escrita vertical, a sublinhatura será posicionada à direita do texto. No modo de escrita horizontal, a sublinhatura será posicionada conforme auto.
initial	Defina essa propriedade como seu valor padrão. Veja initial.
inherit	Herda essa propriedade do elemento pai. Veja inherit.

Valor padrão:	auto
Herança:	sim
Produção de animação:	Não suportado. Veja:Propriedades relacionadas a animação.
Versão:	CSS3
Sintaxe do JavaScript:	object.style.textUnderlinePosition="under"

Os números na tabela representam a versão do navegador que suporta completamente essa propriedade.

Chrome	Edge	Firefox	Safari	Opera
33.0	79.0	74.0	12.1	20.0