Dropdown Box Exceeding Columns

Anonymous

#39848

Hi – I have 3 columns and a search box in each. The columns were made with Visual Composer. The droprown tag box on my search form is going all the way across the page into the next column. Is there a way to limit the length of it? I do have some long tags. Thanks!

Trevor

#39985

Hi

Is it possible to see a live url? Did you use a shortcode to insert the form in VC?

Trevor

#40136

Hi

Your reply came back via the no-reply email box, but I have it now. That might have added a bit of a delay, sorry for that. If you can reply here on the forum itself that will speed up my replies 😉

OK, the issue is the way that browsers render select boxes, and constraining the width is hard. For you, some custom CSS will fix it, but remember that this code will ONLY work where the search form is vertical (for ths reason I have restricted the code to your form ID:

#search-filter-form-6905 .sf-field-tag label {display: block !important;}

If you don’t want it to quiet fill the column, you might want to also have something like this:

#search-filter-form-6905 .searchandfilter select.sf-input-select {max-width: 95%;}

Let me know how you get on with this.

Anonymous

#40162

This reply has been marked as private.

Trevor

#40182

This reply has been marked as private.

Anonymous

#40194

Ok. I do have a sidebar spot too. Do you have code that will work there? Trying the first now.
Thanks!!

Trevor

#40195

It should.

Anonymous

#40199

This reply has been marked as private.

Anonymous

#40205

This reply has been marked as private.

Trevor

#40209

It is not working because the rule above it in the custom css box has an error. That rules looks like this in your code:

#give-donation-level-button-wrap& gt;li {
    float: none;
    display: inline-block;
}

I have had to add a space there so that you can see the code

And should be:

#give-donation-level-button-wrap>li {
    float: none;
    display: inline-block;
}

And the stylesheet is broken from then on down, which means it doesn’t read what you just entered.

[Author]

Posts