Recurring Gift Drop Down Formatting?

Daniel R. Snyder · May 2020

I am wondering if there is a way to change the way the menu options appear on OLX forms specifically when it comes to selecting recurring gifts options. I am including two screen shots below. The first is what the menu looks like in the form builder, easy to read. The second is how it renders on our Drupal website and you can see the drop down options are over the text and it generally looks yucky. Any advice or tricks?

OLX Form Builder View

9601fd51a99ed7aa3b7e7a6f685b41b2-huge-ol

Live Page

de95788c625e20fc6a152c132a1e371d-huge-ol

Chris Martin · May 2020

Hi Dan Snyder‍. This is a little technical but hopefully it helps some. This looks like a bit of a collision between some of the CSS styling that the OLX loads with and some of the styling on your website. If I disable the two styles indicated in the image below coming from your website, the drop downs don't have the overlap with the arrows. Your Drupal site looks like it's overriding the default drop-down arrow look/feel and inserting the cool double arrow as a background image. But the way its implemented, the padding being applied to those form elements just doesn't leave enough space. The easiest CSS fix (if this is feasible for someone at your org to do) is probably to target those OLX form elements in your website's CSS and override the padding coming from the form's CSS and forcibly apply enough to give those arrows some room to breathe:

cce54be6914216bbab75344d12226ff0-huge-st

Thanks,

Chris Martin

Blackbaud Product Management

Daniel R. Snyder · May 2020

Thanks, Chris Martin‍. While I don't have the technical skills to execute the change I understand what you are saying and will pass it on to our web team.

Recurring Gift Drop Down Formatting?

Comments

Categories