Home > Fleeting Sanity > Removing input focus rings in Safari

Removing input focus rings in Safari

September 19th, 2010

You know, the little blue glowing border that highlights the text box you are working in. I was looking for a way to get rid of it as it was detrimental to the visual flow of my site.

I found this little bit of css gets rid of it easy as cake:

:focus {
    outline: none;
}

Presumably, you can add other stylings to the border if you’re not looking to remove it. For instance, the following gave my input boxes an evil red glow:

:focus {
    outline-color: red;
}

Thanks are in order to this post on removing the ring, as this could have been a fairly tricky google search.

Fleeting Sanity

  1. No comments yet.
  1. No trackbacks yet.