Question

I can make Firefox not display the ugly dotted focus outlines on links with this:

a:focus {      outline: none;  } 

But how can I do this for <button> tags as well? When I do this:

button:focus {      outline: none;  } 

the buttons still have the dotted focus outline when I click on them.

(and yes, I know this is a usability issue, but I would like to provide my own focus hints which are appropriate to the design instead of ugly grey dots)

Answer 1

button::-moz-focus-inner {   border: 0; }