How to remove outline Image link ?

Answer 1

Hi Wazdesign,

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

a {
outline: none;
}

Hope that helps.

Cheers, Dean

-db

Answer 2

-moz-user-focus: ignore; in Gecko-based browsers (you may need !important, depending on how it's applied)

Answer 3

Yes we can use. CSS reset as a {outline:none} and also

---

a:focus, a:active {outline:none} for the Best Practice in Resetting CSS, The Best Solution is using common :focus{outline:none} If you still have Best Option please Share

Answer 4

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.

Answer 5

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)

Answer 6

You can put overflow:hidden onto the property with the text indent, and that dotted line that spans out of the page will dissapear.

I've seen a couple of posts about removing outlines all together. Be careful when doing this as you could lower the accessibility of the site.

a:active { outline: none; }

I personally would us this attribute only, as if the :hover attribute has the same css properties it will prevent the outlines showing for people who are using the keyboard for navigation.

Hope this solves your problem.

Answer 7

This works:

:focus {
  outline: 0px /* Make sure you include the "px" after the 0 */
}

---

*Edit:

Scratch that. It does not work.