How to remove the blue border around an image link
April 12th, 2009
No comments
[ad#only_in_post]
You want to use an image as a link.However, a blue border appears around the image.
1 2 3 | <a href="http://www.myownpercept.com/"> <img src="logo.png" alt="" /> </a> |
This border is meant to inform users that the image is a link. Well, it’s a link but this is ugly :s and may not fit your need.
[ad#hire_me]
Solution
- You simply have to add a border-style, set to none, as a style to your img tag
1 2 3
<a href="http://www.myownpercept.com/"> <img style="border-style: none;" src="logo.png" alt="" /> </a>
- A cleaner way, that will pass the W3C validation, is by adding those lines to your CSS file :
1 2 3
img { border-style: none; }
- A dirty old way, but works, is by adding border attribute to the img tag.
1 2 3
<a href="http://www.myownpercept.com/"> <img src="logo.png" border="0" alt="" /> </a>
Recent Comments