Hi everyone, I have added the code below to my website to add a red underline ease-in on hover for link buttons (you can see this feature work on all links within the site), and I love it! However, on the product page just for the pop out ‘THE SIZE GUIDE’ button/link the line doesn’t sit right, instead appearing underneath the link line (images added below).
If anyone has any help on what I might be doing wrong or advise on how to target this specific link that would be greatly appreciated!
URL – https://pantee.co.uk/?_ab=0&_fd=0&_sc=1&preview_theme_id=144118972631
.small-feature-link {
position: relative;
}
.small-feature-link::after {
content: “”;
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 1px;
background-color: #c90013;
transition: width 0.5s linear;
}
.small-feature-link:hover::after {
width: 100%;
}
What it’s doing –
What it should look like –






