ELC

Or in 1 line.


a { outline: 0 none; }


One thing to keep in mind about the outline property is that it is an accessibility feature. When you tab through a web page the purpose of the outline is to show you where your cursor is.

Thanks for the comments! Both are great points.

Thanks for pointing this out Cary. Those dots were driving me nuts just last week.. didn’t know you could fix it with CSS!

I would suggest:


a:active { outline: none;}


It doesn’t interfere with the accessibility issue mentioned by Nathan.
I think you can also return false in your click event to avoid the dotted lines

t?kler

What is the code voor internet explorer? The CSS is only for firefox.

A small Google search, your article, a website fixed.
Thanks

>> “It doesn’t interfere with the accessibility issue mentioned by Nathan.”

The :active{} does interfere with keyboard accessibility; at least in modern browsers (e.g. Firefox3, Opera9.5 and IE8)

There is a JS way to remove the border without destroying usability – or better yet, style that “dotted border”.

For the guy who wanted the IE6/7 fix, see my write up on the subject: http://haslayout.net/css-tuts/view?tut=Removing-Dotted-Border-on-Clicked-Links

Cheers

I believe I’ve tried around 30 diff codes to eliminate this effect – I would now like to say : “Thank you Dave Shenk !”

P.S : Great site boys

So very, very handy… thanks guys. ELC rawks!

Thanks Cary Dunn

Hey dude, you are fabulous! Never thought a simple line would do that trick. Thanks from a starter! Thanks Dave.

Thank You !

I looked everywhere for this fix, and then I found this, thank you so very much!