How to remove the stroke when clicking on input
When you click and focus on input, an outline appears. How do I remove it?
9 answers
input {outline:none;}
This technique also removes the dotted line around the clicked link and around any of the form elements.
A universal solution that removes highlighting in all browsers and not only on input, but also on other elements, including select, button, a:
/* Remove outline on the forms and links */
:active, :hover, :focus {
outline: 0;
outline-offset: 0;
}
Try putting box-shadow: none;
I had this problem. I just did so when using Bootstrap
I had this problem. I just did this:
input {outline: 0 !important;}
Apply the property outline:none
Specifically for input and specifically when focusing on it:
input:focus {outline: 0;}
I checked it on Chrome.
If you use Bootstrap, then box-shadow may be used.
Try putting box-shadow: none;
Add also onFocus="this.blur()"
There is no way to physically remove the stroke, the browser draws it itself.
In fact, it can be collapsed to a point if the A element has a style of display:inline instead of display:block. This won't affect the hotspot, but it's a bad option.
It is best to make the A element on top of the entire label, then nothing will obscure the label and it will look great.