CODEWITHSUNDEEP
html
villager1
villager1

Reputation: 80

Underscore appears at end of images anchors

There is a problem with my code where tiny underscores appear on the bottom-right corner of my anchor image. I have no idea how to fix it. I've heard answerers form other similar questions saying you have to add a closing </a> tag at the end, but that doesn't seem to be the problem, as I already have those tags included in my code. I also don't remember adding underscores into my code on purpose, so I have no idea how it can be removed.

<!DOCTYPE html>
<html>
<head></head>
<body style="background-image: url(https://img.michaels.com/L6/3/IOGLO/852866719/201341423/10151236.jpg?fit=inside|1024:1024);">
<button onclick="executeCommand()" style="border: 0; background: 0;"><img src="https://image.flaticon.com/icons/svg/54/54527.svg" style="padding: 5px 0px 0px 0px; width: 40px; height: 40px;"></button><div id="search"></div>
<br>
<a href="https://www.google.ca/" target="_blank"><img src="https://storage.googleapis.com/gweb-uniblog-publish-prod/images/Chrome__logo.max-2800x2800.png" alt="Google Chrome" style="width: 40px; height: 40px; padding: 0px 0px 5px 4px">
</a>
<br>
<a href="https://mail.google.com/" target="_blank"><img src="https://storage.googleapis.com/gweb-uniblog-publish-prod/images/Gmail_logo.max-2800x2800.png" alt="Google Mail" style="width: 40px; height: 40px; padding: 5px 0px 5px 4px">
</a>
<br>
<a href="https://docs.google.com/" target="_blank"><img src="https://seeklogo.com/images/G/google-docs-logo-6A8CD4F30A-seeklogo.com.png" alt="Google Docs" style="width: 30px; height: 40px; padding: 5px 0px 5px 9px">
</a>
<br>
<a href="https://www.youtube.com/" target="_blank"><img src="https://lh3.googleusercontent.com/Ned_Tu_ge6GgJZ_lIO_5mieIEmjDpq9kfgD05wapmvzcInvT4qQMxhxq_hEazf8ZsqA=w300" alt="Youtube" style="width: 40px; height: 40px; padding: 5px 0px 5px 4px">
</a>
</body>
</html>

Upvotes: 1

Views: 910

Answers (2)

Christian Grimm
Christian Grimm

Reputation: 1

I had the same problem. this person, is the answer: "Put the “a” tag directly after the “img” tag, i.e. get rid of the newline (which will be parsed as a space). – user3603486 Apr 1 '18 at 15:13"

see my example att: anchor underscores: enter image description here

Upvotes: 0

Marouane B.
Marouane B.

Reputation: 151

Add this CSS line

a{
    text-decoration: none;
}

Upvotes: 1

Related Questions