Menu
I have some buttons using <button>, which when clicked get a blue selected color!
Is there a way to remove this feature?
385
To remove focus around the button outline:none property is used. Outline property: Outline is an element property which draws a line around element but outside the border. It does not take space from the width of an element like border.
Show activity on this post. So use border: none; and that annoying blue border shall disappear!
That is a default behaviour of each browser; your browser seems to be Safari, in Google Chrome it is orange in color!
Use this to remove this effect:
button { outline: none; // this one } You can remove the blue outline by using outline: none.
However, I would highly recommend styling your focus states too. This is to help users who are visually impaired.
Check out: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#navigation-mechanisms-focus-visible. More reading here: http://outlinenone.com
23
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
