CSS Tip: Outline

Some HTML Elements contains an outline when a element is focused.
It's such a ugly thing to have around a blog/website, but, you can remove it in Firefox.

Elements with Outline: <anchor>         
Elements without Outline:    <anchor>         

CSS Snippet

* button::-moz-focus-inner, * a, * img::-moz-focus-inner, * input::-moz-focus-inner {
  outline: none !important;
  border: 0 !important;

*:-moz-any-link:focus {
  outline-width: 0 !important;
To remove outline from <input> elements, you need to blur the control once it gets focused:
<input type="radio" onfocus="this.blur();"/>
<input type="checkbox" onfocus="this.blur();"/>


Anonymous said...

Or you can try this

*:focus {
outline: 0;