Dynamic Dropdown Widget: How to match its styling with the rest of the form?

Hi there,

I checked your forms and couldn't locate the dynamic dropdown widget in any of your forms. Please share the form link and a screenshot of the field you want to customize. We will gladly assist you.

Kindly share the screenshot by following this guide as email attachments are not supported on our forum: https://www.jotform.com/help/438-how-to-post-screenshots-to-our-support-forum.

I have attached a photo which shows the difference between a normal dropdown box accepting the whole form colour Vs the dynamic dropdown which defaults to white with no way to change it other than CSS. Any assistance is greatly appreciated.

Hi there,

To write CSS for this, we need that specific field's ID which can only be possible if you have added this field in your form. Please share your form link in which you have added this field so we could share CSS specifically for your form.

Waiting for your response.

Hello Zahra,

Here is the link that you have requested. Your prompt assistance is greatly appreciated.

https://form.jotform.com/211828503707859

Thank you for sharing this.

Please allow me some time to work on this. I will get back to you soon.

Please add the following CSS code in the widget:

.selecter .selecter-selected{

background-color: #F5F3EE !important;}

.selecter:hover .selecter-selected{

background-color: #F5F3EE !important;}

.selecter .selecter-item{

background-color: #F5F3EE !important;}

Result:

Complete Guide: How to Inject CSS Codes to Widgets

Here's the form I cloned for testing: https://form.jotform.com/211831481400949. Feel free to test it on your end.

I hope this helps. Please let us know if you need further assistance.

Hi Zahra,

Thank you for this code. It works great and is a huge improvement to my form.

Kind regards,

Elliot.