Get Rid of Dotted Outlines on Windows Browsers

For you web developers, I am sure your clients have often tried to make you do the impossible — correct mistakes and/or idiotic decisions made by Microsoft on how browsers should behave on the Windows operating system. Fortunately some of these mistakes can be corrected with hacks and work arounds. Here’s another one…

Some browsers (namely IE and Firefox) have this annoying behavior that’s a Windows-only trait — upon clicking an active link, it leaves a ghosting outline of dots around the link enclosed by the anchor tag. There are two work arounds that I know of to get rid of, or rather, prevent this from happening.

Method 1: Javascript — Yes, yes, I know client-side scripting is not reliable and all that jazz. All I am saying is, this is A work around. The idea is to make these links sans-anchor tags… That is to say, write a Javascript to respond to “onClick” events within, say,

1
< div>

or

1
< span>

tags.

EXAMPLE:

1
< div onClick="doSomething();">Click Me< /div>

Method 2: Div tags — If you are trying to avoid Javascript at all costs,

1
< div>

or

1
< span>

tags may be your best friend. Simply enclose your links with a

1
< div>

or

1
< span>

tag immediately following the

1
< a>

anchor tags, the ghost dots will disappear all by themselves. Sweet, huh?

EXAMPLE:

1
< a href="linkToSomething.html">< span>Click Me< /span>< /a>

Again, if Microsoft had bothered to adhere to industry standards, there wouldnt’ be a need to use work arounds like these. So I beg of you, use an alternative browser as much as possible. And only use IE sparingly when you must (for those idiots who develop sites that work ONLY with IE).