Streaming live at 10am (PST)

How to change the default color of a dropdown list?

Hey guys and gals I am new to Webflow but getting along. I have a drop down menu and in the “dropdown link” I cannot remove the BG color. I can change the color, and that works. If I drop. In the desginer it says “none” under solid color and transparent on the next line. If I choose color I can add a color. If I drop opacitiy to zero the stock grey returns. I can seem to cover the grey, but not remove it. I want a transparent box with just they type visible.

I tried a zillion times and differemt things checking the states and all. I must be missing something simple, but it’s driving me mad. I even closed and reopened the program to see if that would help. Any thoughts or suggestions?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

page 4 :

Hello @IPT welcome to the Webflow community!

It’s not the link that is containing the grey default colour but the dropdown list which is the wrapper that holds the links.

To change this (as you can’t select it from the canvas) open the drop down menu, and then in the Navigation Panel (F), select dropdown list. While this element is selected, go back to the Styles Panel (S) and scroll down to the background colour. You will see #ddd which is the colour code for the default grey.

Here’s a GIF to show you.

You can now change this accordingly. Once you have styled a dropdown button, you can give these all the same class name so they all act the same. (The content can be different in each one)

You currently have 3 dropdowns, all with different class names which means you’ll have to style each one individually. Giving them the same class name speeds up this process for you, and writes cleaner code too. :slightly_smiling_face:

Check out some of the university tutorials if you haven’t already as they’ll help you understand the different elements and getting the best out of the designer.

thank you mark. Yes, I think sometimes I think I am in a certain element but I am really in another. I appreciate your help!

@IPT You’re welcome.

Just ini case you didn’t know, you can always see the parents of the item you’ve selected at the very bottom of the designer, you can even click them too to select them without having to go into the navigator panel.

Ah, I was looking to have a faster way to select than going into the control panel - thanks again!

1 Like