Мне нужно добавить расстояние между текстом и свойством underline для этого текста

Question

У меня есть заголовк-ссылка, и при наведении она должна иметь свойство подчеркивания как на изображении ниже; При наведении я даю свойство text-decoration: underline solid 1px $green;

И у меня получаеться такое:

Мне нужно добавить расстояния между текстом и свойсвтом underline!

Answer 1

p {
  max-width: 200px;
  text-underline-offset: 4px;
  text-decoration: underline;
  text-decoration-color: aqua;
}

<p>Inflammation of the thyroid i what should i watch out for?</p>

Answer 2

Ну или border-bottom и padding-bottom

p {
  max-width: 400px;
  margin: 0 auto;
  text-align: center;
  font-size: 175%;
}

p > span {
  display: inline;
  border-bottom: 1px solid aqua;
  padding-bottom: 3px;
}

<p><span>Inflammation of the thyroid i what should i watch out for?</span></p>

БЛОГ НА HUSL

Мне нужно добавить расстояние между текстом и свойством underline для этого текста

Ответы (2 шт):