Remove Blue Outline on Form Fields in Safari OnFocus

When you’re testing for cross browser compatibility you will notice that when you click an input, textarea, or select field in Safari browser you’ll see a blue outline.

This may harm the design of your website and make confusions on some situations.

This issue is similar to Chrome browser’s orange outline on form fields on mouse focus. Take a look at the image below:

Remove blue outline on safari form fields onFocus

To remove the annoying blue outline, paste the code below on your CSS file.

input:focus, textarea:focus, select:focus{
outline: none;
}

This will work on all versions of Safari and the code is valid under W3C standards.

*Some links may contain affiliate links. I may get small commission from your purchases to fund this website and to avoid annoying ads.