Streaming live at 10am (PST)

How to style the options menu of a dropdown select field

Happy Monday, Webflow peeps!

I am currently working on a site and I am having trouble getting my <select> field to style properly. I can get the field itself to look like I want it to, but then I can’t seem to change any styling on the actual dropdown that shows the options. I am pretty sure I figured this out before, but I can’t seem to remember how I did it. Basically, the issue I am having now is that the text is showing up as white on white bg whenever the select dropdown is focused.

Any help is appreciated!


Here is my site Read-Only: Webflow - Tyler's New Website
(how to share your site Read-Only link)

Where is the dropdown Tyler?

On the contact form at the bottom of the page

The default input select color is at almost 100% opacity right now. image This is a close color match to what that the color with opacity is. The dropdown takes on whatever that select property is currently you have it set to almost invisible. Might be better to make the default inputs an actual color.

Jeremy,

Thanks for the response, but I was able to get it figured out. Basically it looks like, as of right now, the only way to customize the <option> tags within the built in <select> element is to use custom code.

I just added my select field as an Embed element, and then customized the css of the options through there. It seems to have worked so far! :slight_smile:

1 Like

That’s good workaround. Otherwise, there is no way to give a class to those options. I’m going to store this one for later use.