The Issue

You downloaded Chrome, Google's new web browser, to take it for a spin and see what all the fuss was about. Looks great, performs like a Ferrari. But what's with that orange outline on every active element?

You might recognize the outline from browsing around in Safari and having witnessed a similar blue outline. Well, fortunately for you, we are going to kill two birds with one stone.

The One Line Solution

This problem can be solved with a simple CSS selector. Here it is.

*:focus
{
    outline: none;
}

The CSS itself is short, and simple, but quite powerful. It essentially says, "When any element is in focus, ensure that no outline is drawn around that element."

A Word of Warning

This technique will affect EVERY element in your site. If you wish to maintain an outline for any of your existing elements when in focus, be sure to add an outline to that selector.

We hope that you found this quick tip useful!