[Resolved] With a Custom Earch Filter (for Taxonomy), I want the multi-select box larger

[Author]

Posts

[pierreV-2]

Hi,

I am trying to: have a good looking custom search filter on my archive page. I have chosen to create a multi-select filter though only 2 lines at a time appear. Is it possible to either have more lines appearing or even better having it appear larger as a kind of dropdown filter (which closes after selection)?
I have WP Types working with the Avada theme.

I visited this URL: hidden link

Filter Editor:

[wpv-filter-start hide="false"]
[wpv-filter-controls]
<h3>Customise your search by selecting one or more sports and the Emirate.</h3>
<small>(For multiple selections, ctrl & select)</small><br>
[wpml-string context="wpv-views"]Sports:[/wpml-string] [wpv-control taxonomy="sport" url_param="wpv-sport" type="multi-select" hide_empty="true"]
[wpml-string context="wpv-views"]Locations:[/wpml-string] [wpv-control taxonomy="location" url_param="wpv-location" type="multi-select" hide_empty="true"]
[wpml-string context="wpv-views"]Active in:[/wpml-string] [wpv-control field="active-in" url_param="active-in" type="multi-select" hide_empty="true"]
[wpml-string context="wpv-views"]Type of organisation:[/wpml-string] [wpv-control taxonomy="type-of-organisation" url_param="wpv-type-of-organisation" type="checkbox"  auto_fill="wpcf-type-of-organisation" auto_fill_sort="asc"]
[wpv-filter-reset reset_label="Clear" type="button"]
[wpv-filter-submit name="Search" type="button"][wpv-filter-spinner container="div" position="after" spinner="<em><u>hidden link</u></em>"][wpml-string context="wpv-views"][/wpml-string][/wpv-filter-spinner]
[/wpv-filter-controls]
[wpv-filter-end]

[Luo Yang]

Dear Pierre,

I think it needs a little custom CSS codes, for example:

select.js-wpv-filter-trigger{
width: 100%;
    height: 80px;
}

See screenshot larger.JPG

[pierreV-2]

Thanks, that worked!