Manchmal sind Browser eigenmächtig: So rendern chromebasierte Browser gerne mal Suchfelder anders als erwartet. Abhilfe ist einfach.
Im Bild sieht man ganz gut, dass Chromium an dieser Stelle gerne ein kleines Kreuzchen als Conveniance-Feature einblendet, wenn das Suchfeld den Fokus hat. Das ist gut gemeint und ermöglicht, eine erfolgte Eingabe zu löschen oder zu korrigieren. Insbesondere bei Suchfunktionen, die ihre Ergebnisse per AJAX bereits während des Tippens anzeigen, ist diese Hilfe jedoch überflüssig. Anstatt mit der Maus innerhalb des Suchfeldes zur Löschfunktion zu navigieren und dann das Feld per Klick zu leeren kann man stattdessen ganz einfach auch die Backspace-Taste nutzen. Weniger Klicks, schnellere Bedienung. Und ohnehin: Man muss ja nicht die Suche mit <Enter> bestätigen.
Also möchten wir das 'X' gerne loswerden, das sich in browserspezifischen Styles versteckt. Auf eine Variante für den glücklicherweise obsoleten Internet Explorer (die sich hinter -ms-reveal versteckt) verzichten wir dabei gerne und setzen die folgenden CSS-Anweisungen:
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration{
display: none;
}
Et voilá: Unsere Seachbox ist jetzt frei von Allem, was hinderlich erscheint.
Einen Kommentar schreiben
Hast Du Fragen oder Anregungen? Dann nutze die Kommentarfunktion.