Remove Blue Border On Click Button

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on email
Email
Remove Blue Border On Click Button

When designing website forms, you will come across a nasty default border being generated when a button is clicked. This is because, by default, an outline or border is present when a button receives a focus state. This can be removed by simply adding the following CSS code.

/**
 Remove focused button styles when an element received focus
 via mouse click or touch.
 */
 *:focus:not(:focus-visible) {
 outline: 0 !important;
 box-shadow: none !important;
 } 

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on email
Email

Leave a Comment

Your email address will not be published. Required fields are marked *