Need help with custom form select dropdown

Description


Subject: Custom Select — Unable to Set Solid Background on Dropdown Container

Message:

Hi Finsweet Support,

I’m using the Custom Form Select (fs-selectcustom) attribute on a Webflow project and running into a styling issue I can’t resolve.

The Problem:

The dropdown list container (fs-selectcustom_dropdown-list) will not accept a solid background color. Despite setting a background color on both the list container and the individual option links (fs-selectcustom_link), the dropdown remains transparent. This causes content behind the dropdown — such as radio buttons, text labels, and other form elements — to visibly bleed through behind the options when the dropdown is open.

What I’ve Tried:

  • Setting a solid background color on fs-selectcustom_dropdown-list via the Webflow Designer

  • Setting a solid background color on each fs-selectcustom_link element

  • Confirming the component structure matches the cloneable

  • Verifying that the script tag includes fs-selectcustom

What I Expected:

A fully opaque dropdown container where no content behind it is visible when the dropdown is open.

Environment:

  • Webflow hosted site

  • Using Finsweet Attributes V2 via CDN

  • Script: https://cdn.jsdelivr.net/npm/@finsweet/attributes@2/attributes.js

I’ve attached a screenshot showing the issue. Any guidance on how to achieve a solid background on the dropdown container would be greatly appreciated.

P.S. — If you could also offer any guidance on removing the purple background that appears on the currently selected option (“Select an option”), that would be greatly appreciated as well. I’ve tried changing the background color on the fs-selectcustom_link element and its combo classes, but the purple persists on the active/selected state. I’d like all options — including the selected one — to have the same solid dark background as the rest of the dropdown.

Thank you!

Site URL

Required: Please provide a staging/production URL where we can see the issue

Video/Screenshots

Required: Please provide a short screen recording showing the issue

Additional Context

NDA Notice: If you’re under an NDA, please feel free to send us a Direct Message/Email with the above information.

Hey @Joseph_Bates

Add these styles to the <head> custom code section

.fs-selectcustom_dropdown-list.w--open {
  background-color: black !important; /*or whatever color works*/
}

For the purple background

.fs-selectcustom_link.w--current {
  background-color: red !important; /*or whatever color*/
} 

:grin: :clap::clap::clap: THANK YOU!