Как удалить все стили полей поиска Webkit по умолчанию?

по умолчанию <input type="search" /> отображает как "родное" поле поиска в Mac OS X(закругленные углы, кнопка очистки и т. д.). Я хочу полностью удалить этот пользовательский стиль, чтобы вход выглядел идентично эквивалентному текстовому вводу (<input type="text" />), но при сохранении типа ввода в search.

Я пробовал -webkit-appearance: none;, что очень близко...но есть что-то забавное с полями/заполнением, которые я не могу переопределить, что заставляет ширину поля поиска рендеринг ~20px короче текстового ввода.

есть еще -webkit- конкретное свойство, о котором я не знаю, чтобы полностью отключить стиль?

14
css input search textbox webkit

1 ответов

попробуйте эти стили:

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;
}

источник:http://css-tricks.com/webkit-html5-search-inputs/#comment-82432

49