Christian Heilmann

How to remove the ugly border around an image in a link

Wednesday, December 14th, 2005 at 11:32 am

Common issuesThis question pops up almost weekly on message boards, mailing lists and in chat sessions:

How can I remove the ugly border around an image when it is linked?

I am amazed that this is still a question that needs to be asked, but the trick to remember is that when you put an image inside a link, like:


products

Then the browser puts a border around the image in the colour of the link. Therefore, changing the link border setting will not have any effect:

a {border:none; }

Instead, you need to set the image border to “*none*”:

 a img {border:none; }

It might be a good idea to define this as a preset in the beginning of your style sheet, to avoid the need to repeat it over and over again.

Also notice that the setting is “border:none”, which tells the user agent that there should not be a border – if you use “border:0” you expect the User Agent to know how to display a border with a width of 0, which might not be possible.

I hope that this is going to be a post to show up high in google sooner or later, much like the ugly yellow form fields one.

Share on Mastodon (needs instance)

Share on Twitter

Newsletter

Check out the Dev Digest Newsletter I write every week for WeAreDevelopers. Latest issues:

Dev Digest 146: 🥱 React fatigue 📊 Query anything with SQL 🧠 AI News

Why it may not be needed to learn React, why Deepfake masks will be a big problem and your spirit animal in body fat! 

Dev Digest 147: Free Copilot! Panel: AI and devs! RTO is bad! Pi plays!

Free Copilot! Experts discuss what AI means for devs. Don't trust containers. Mandated RTO means brain drain. And Pi plays Pokemon!

Dev Digest 148: Behind the scenes of Dev Digest & end of the year reports.

In 50 editions of Dev Digest we gave you 2081 resources. Join us in looking back and learn about all the trends this year.

Dev Digest 149: Wordpress break, VW tracking leak, ChatGPT vs Google.

Slowly starting 2025 we look at ChatGPT vs Google, Copilot vs. Cursor and the state of AI crawlers to replace web search…

Dev Digest 150: Shifting manually to AI.

Manual coding is becoming less of a skill. How can we ensure the quality of generated code? Also, unpacking an APK can get you an AI model.

My other work: