Время для прочтения: 0 мин. 43 сек.

Убрать желтый фон у полей с autocomplete в Google Chrome

В браузерных стилях Google Chrome для полей с autocomplete прописан желтый (#FAFFBD) фон и черный (#000000) цвет текста, усиленные при помощи !important, соответственно, переопределить их в пользовательских таблицах стилей нельзя. Выхода вижу всего два.

Первый способ

Можно тупо выключить автозаполнение для всей формы


<form autocomplete="off">

или для конкретного поля


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

Это сработает, но пользователь вам спасибо не скажет, так как автозаполнение перестанет работать полностью.

Второй способ

Другим вариантом является задание большой внутренней тени для полей с цветом равным цвету желаемого фона


input {outline: none;}
input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 50px #fff !important; /* Цвет фона */
    -webkit-text-fill-color: #999 !important; /* цвет текста */
    color: #999 !important; /* цвет текста */
}

Правда у этого способа есть один недостаток — нельзя задать фоновую картинку!

Ссылки по теме

Для вставки кода используйте HTML-теги
<pre><code class="php">ваш код</code></pre>

  • Потому что я Gangster

    спасибо. работает как нужно, только цвета заменил

    • Всегда пожалуйста!

  • CSharp “CPlusPlus” Java

    не работает

    • Что именно не работает?

    • А кто спорит 🙂 Вот еще бы они его пофиксили с 2008-го года хоть раз или выложили бы человеческое решение!