Menu
I'm courious why "Should not be underlined" words are still underlined in the code below:
<html>
<head>
<style type="text/css">
.badge1-link { text-decoration: none; }
.badge1 { text-decoration: underline; }
.badge2-link {text-decoration: underline;}
.badge2 {text-decoration: none;}
</style>
</head>
<body>
<a href="#" class="badge1-link"><span class="badge1">Underlined</span> | not underlined</a>
<br/>
<a href="#" class="badge2-link"><span class="badge2"> Should not be underlined</span> | Underlined</a>
</body>
</html>
631
Once an anchor tag has been given underlining it cannot be partially removed, in the way you are suggesting for badge2
See this link: Remove stubborn underline from link. The accepted answer has some comments which state the same.
The solution to your problem is to remove the underlining from the anchor tag, and then add partial underlining as you did with badge1
153
answered Nov 25 '25 09:11
display:inline-block will do the trick. its worked for me. change your style as below
.badge2 {display:inline-block;text-decoration: none;}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
