Kan iemand mij uitleggen hoe ik de oranje of blauwe rand (outline) rond tekst/invoervakken kan verwijderen? Ik denk dat het alleen in Chrome gebeurt om te laten zien dat het invoervak actief is. Hier's de input CSS die ik'gebruik:
input {
background-color: transparent;
border: 0px solid;
height: 20px;
width: 160px;
color: #CCC;
}
Deze rand wordt gebruikt om aan te geven dat het element gefocusseerd is (d.w.z. dat je de invoer kunt typen of op de knop met Enter kunt drukken). Je kunt het echter verwijderen:
textarea:focus, input:focus{
outline: none;
}
Misschien wil je een andere manier toevoegen om gebruikers te laten weten welk element toetsenbordfocus heeft, voor de bruikbaarheid.
Chrome zal ook andere elementen highlighten, zoals DIV's die als modals worden gebruikt. Om de highlight op die en alle andere elementen ook te voorkomen, kun je het volgende doen:
*:focus {
outline: none;
}