Hello again
I was reading about how you can turn off the gel-box styling of safari’s dropdowns with the code
-webkit-appearance:none;
But it hasn’t worked. Its possible I am embedding it wrong as I’m no code expert… which is why Im using webflow I guess !
See below for the culprit in question.
I want to turn off all styling, as I have styled a div underneath it to match how I want the form to look.
You can view Contact Semasio on chrome for a reference on what I’m after.
Thank you!
Here is my site Read-Only: https://preview.webflow.com/preview/semasio?preview=a4c19a8b6f78f2fefbfff25a84e7ed5f
Yeah this is a common problem. You’ll need to add custom code to get this working for all browsers consistently.
Consistent dropdowns that can match your nicely styled inputs and textareas! Support for Chrome, Safari, iOS, Firefox & IE9+.
https://stackoverflow.com/questions/1895476/how-to-style-a-select-dropdown-with-css-only-without-javascript
https://stackoverflow.com/questions/15508154/the-correct-way-of-styling-a-select-menu-for-cross-browser-functionality
In doing theme or plugin development, maybe you’ve noticed that the various browsers represent fields and inputs differently. Two recent projects, I ran into this inconsistency, and the client wanted everything uniform. So, here’s what the...
Est. reading time: 1 minute