Arrows on Drop Down Select

[nathanjrb]

Hi There,

I’m not sure if I’m seeing these changes because I have just updated my theme (UNCODE – https://undsgn.com/uncode/).

I have an issue with drop downs, where the down arrows are appearing multiple times. Please see attached screenshots.

I have tried enabling the “Enhanced Select” option under styles and that sort of fixes it. It doesn’t fix the “Title” fields though.

When you hover the cursor over it, it goes away.

Link to one of the forms in question: https://www.nathanbuckfilms.co.uk/contact/

Please can you advise?

Thanks,

Nathan

Attachments:

You must be logged in to view attached files.

[katw]

Hi @nathanjrb

Thought I could help out.

Yes the issue is coming from your theme stylesheet: /themes/uncode/library/css/style.css.

It has a css style called .style-light select:not([multiple]) which is doing a repeat background on form single select fields.

You need to override by adding something like:

.quform select:not([multiple]) {
  background-image: no-repeat;
  background-position: 10% center;
}

This needs to go in your child stylesheet or customiser additional css. Don’t edit the theme directly.

The .quform class prefix means any quform form will no longer be affected by the repeat issue on single select popup fields.

You are likely to find others similar to this as you add other form field types.

[nathanjrb]

Hi,

Thanks for this! I tried it but it didn’t quite work. The Uncode support team suggested:

.style-light select:not([multiple]) {background-repeat: no-repeat !important; background-position: right !important;}

…and it worked a treat.

Just the red tool tips to solve now! 🙂

Thanks,

Nathan

[katw]

What I suggested was correct.

You just needed the !important to force it to change.

The prefix I used on my answer .quform was to limit the change to pages with Quform forms.

Whereas, they have given you code that will apply across the site on all forms.

Anyhow, glad its working

[nathanjrb]

Hi Katw,

I understand, thank you. I do appreciate your help all the same and I may wish to limit it to just Quform forms in the future if things go wrong, so this was still helpful.

Thanks,

Nathan

[Author]

Posts