Just correct this using CSS.
The appearance property is used to display an element using a platform-native styling based on the users’ operating system’s theme.
.thing {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
This is used for one of two reasons:
- To apply platform specific styling to an element that doesn’t have it by default
- To remove platform specific styling to an element that does have it by default
For instance, inputs with a type=search in WebKit browsers by default have rounded corners and are very strict in what you can alter via CSS. If you don’t want that styling, you can remove it in one fell swoop with appearance.
input[type=search] {
-webkit-appearance: none;
}
Or you could take a input with type=text and just make it look like a search input:
input[type=text] {
-webkit-appearance: searchfield;
}