Blog

Webkit input-autocomplete – Entfernen der gelben background-color


Wie entferne ich den gelben Hintergrund in Webkit autocomplete-input-Feldern?

Der Webkit-Browser gibt uns mit seinem autocomplete-input-Feldern ein echtes Rätsel auf. Niemand möchte einen gelben Hintergrund in seinen input-Feldern sehen. Trotzdem ist es ein echter Akt, die Hintergrundfarbe dieser autocomplete-Felder zu ändern.

Sicher habt ihr auch schon ein paar Möglichkeiten durchprobiert. Mit

input:-webkit-autofill {
  background-color: #fff !important;
}

kommt man leider nicht weiter. Natürlich gibt es die Möglichkeit die autocomplete-Funktion ganz abzuschalten:

<input type="text" name="name" autocomplete="off">

Allerdings ist das auch nicht die Königslösung. Hier ist ein kleiner Trick, um zum Ziel zu gelangen, bis es eine wirklich saubere Lösung für dieses Problem gibt:

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
}

Das war es schon. Weg ist der hässliche gelbe Balken:-)

Du magst den Post?
Loading...Loading...

Blog