How can I remove the outline around hyperlinks images?

Solution 1:

For Remove outline for anchor tag

a {outline : none;}

Remove outline from image link

a img {outline : none;}

Remove border from image link

img {border : 0;}

Solution 2:

You can use the CSS property "outline" and value of "none" on the anchor element.

a {
outline: none;
}

Hope that helps.

Solution 3:

For Internet Explorer 9:

a:active, a:focus { 
 outline: none; 
 ie-dummy: expression(this.hideFocus=true);
}

Source: http://social.msdn.microsoft.com/Forums/en-HK/ieextensiondevelopment/thread/1023adfd-bd73-47ac-ba9c-2bad19ac583a

Solution 4:

Please note that the focus styles are there for a reason: if you decide to remove them, people who navigate via the keyboard only don't know what's in focus anymore, so you're hurting the accessibility of your website.

(Keeping them in place also helps power users that don't like to use their mouse)

Solution 5:

There is the same border effect in Firefox and Internet Explorer (IE), it becomes visible when you click on some link.

This code will fix just IE:

a:active { outline: none; }.

And this one will fix both Firefox and IE:

:active, :focus { outline: none; -moz-outline-style: none; }

Last code should be added into your stylesheet, if you would like to remove the link borders from your site.