Die Textfarbe für die automatische Vervollständigung wird überschrieben, wenn die Rechtschreibprüfung des Browsers in de ⇐ CSS

[Anonymous]

Ich verwende die Shadcn-Eingabekomponente und habe auch die automatische Vervollständigung für die Eingabefelder aktiviert. Wenn ich jedoch aus diesen Vorschlägen wähle, ändert sich wenige Sekunden nach der Auswahl aus den Vorschlägen und genau dann, wenn die schnörkeligen roten Linien (die aus der Rechtschreibprüfung) unten erscheinen, die Farbe des Textes von der von mir angegebenen Farbe in die schwarze Farbe.
Außerdem habe ich kürzlich den folgenden Code zu globals.css meines Next.js-Projekts hinzugefügt, um das Problem der automatischen weißen Farbe durch den Browser zu lösen in meine Eingabeelemente, sobald ich aus den Autovervollständigungsvorschlägen auswähle:

Code: Select all

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 1000px transparent inset ;
-webkit-text-fill-color: /*my color in rgb*/ ;
caret-color: /*my color in rgb*/;
transition: background-color 9999s ease-in-out 0s;
}

Hinweis: Dies passiert nur, wenn Sie Text auswählen, der diese schnörkeligen roten Linien aufweist (z. B. falsch geschriebene oder ungewöhnliche Wörter)