Disable Text-field Blue Highlight In Chrome Extension?
I'm working on a Chrome extension that let's you edit a small text field, and I'm finding the blue highlight around the text field when clicked really annoying. Is there a way (pre
Solution 1:
Yes; just assign 'none' to the 'outline' property:
input {
outline: none;
}
Please consider that the outline is a UI feature to highlight the currently-active/-focused form element and removing that visual cue might hinder some users.
Edited in response to the comment lefty by Beakr, the OP, in comments below:
I was intending to disable it/modify it to see what it could do.
To adjust the style for the outline
you can access the individual properties:
elementSelector:focus {
outline-width: 4px; /* thin, medium, thick or standard CSS length units */outline-style: auto; /* or 'inherit', 'none' or border-style (solid, dashed, dotted...) */outline-color: #f90; /* standard CSS colors */
}
The above can also be condensed, using shorthand notation:
elementSelector:focus {
outline: 4px auto #f90;
}
The smallest of the possible outline measurements that can be used are either:
elementSelector:focus {
outline-width: thin; /* or 1px */
}
Post a Comment for "Disable Text-field Blue Highlight In Chrome Extension?"