У меня есть анимированная строка под ссылками. Он отлично работает для однострочных ссылок, но у меня есть некоторые ссылки, разделенные разрывами строки <br>
Есть ли способ, чтобы анимированное подчеркивание появлялось вдоль всех строк ссылки? Спасибо
body {
padding: 20px;
font-family: Helvetica;
}
a{
font-weight: bold;
color: black;
position: relative;
text-decoration: none;
}
a::before {
content: "";
position: absolute;
width: 0%;
height: 2px;
bottom: 0;
background-color: #000;
transition: all 0.2s;
}
a:hover::before {
width: 100%;
}
<a href="">my link</a>
<br><br>
<a href="">this is<br>a much<br>longer link</a>