Currently, I am in the process of adding links to a footer by using <img> tags with SVG images. However, I am encountering an issue where there are small blue lines under the icons.
After searching online, it seems that you need to add this CSS code:
.icon {
width: 3%;
height: 3%;
text-decoration: none;
outline: none;
}<ul>
<li>
<a href="https://github.com/--/">
<img src="images/github.svg" class="icon">
</a></li>
<li><a href="https://www.linkedin.com/in/--/">
<img src="images/linkedin-logo.svg" class="icon">
</a></li>
<li><a href="files/--.pdf">
<img src="images/home.svg" class="icon">
</a></li>
</ul>I am unsure about what else can be added to resolve these faint lines! Any suggestions?
An image illustrating the issue can be found here.