Richard Richard - 1 year ago 92
CSS Question

How to remove the default button highlighting in Safari when using jQuery

I have noticed that under Safari on OS X my default jQuery buttons appear to have a blue glow highlight around them. Just checked and the same thing happens on the jQuery UI Demo page.

Default button highlighting under Safari

Under Firefox on my same machine it looks like this

enter image description here

Can anyone tell me what I can do to remove this under Safari? I would still like the default behaviour.

Answer Source

To remove any highlight of inputs that any browser may apply as default action you can always use outline:none for their css. in your case it's a button element. so this should work:

button {
    outline: none;

Although it's not recommended to remove the CSS outline. as it's is bad for accessibility. (Thanks Robin Clowers for mentioning this)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download