I'm using <input type='button' class='button' onclick='myFunction()' /> to call a function, and I'm using CSS to replace the standard button graphic with a round image. Is there a way to get rid of the dotted border that appears inside a button when you click it? Since my image is round, that dotted border sticks out on the "corners" and makes the image look a bit messy.
The border disappears when focus is removed from the button (aka onblur), as in clicking elsewhere or tabbing off of the button. So one idea I had was to automatically remove focus from the button when it is clicked:
<input type='button' class='button' onclick='myFunction(); focusElsewhere' />
But I don't know how to do that. Does anyone else know? Or do you have other ideas how to accomplish what I'm trying to do here?
Let me know if you need me to post the CSS I'm using to replace the button graphic.