Question

Is there anyway to prevent Chrome from styling the input type=search. I can style the input fine when it is a input type=text although once I change this to a HTML5 search it boxs all styles I have applied to the input.

Type = text

Type = search

Updated answer with reset properties

input[type="search"] {
    -webkit-appearance: textfield;
}

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  {
    -webkit-appearance: none;
}

Answer 1

You could try:

input[type="search"] {
    -webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

Does it help?