Support Forums

Hi

What do you want to do with the background container (and why is crews higher on the page)?

You need to add some custom css to your theme. To fix that Crew being in the wrong place, this:

.searchandfilter > ul > li {float: left;}
.searchandfilter > ul > li.sf-field-taxonomy-yacht-feature {margin-top: 35px;}
.searchandfilter > ul > li.sf-field-sort_order {margin-top: 33px;}

To add a border around plus background for the form, this is a bit more difficult. So, I think that, in your page in WordPress, it looks like this:

<div class="search-filter-form-container">[form shortcode]</div>

But it needs to look like this:

<div class="search-filter-form-container">[form shortcode]<div class="clearfix"></div></div>

Then, I can see in the custom css you already have this:

#top form {
    margin-bottom: 20px;
}

But this needs to be:

.search-filter-form-container {
    margin-bottom: 20px;
/* add your css for the border, drop shadow, background color here */
}

What does not work? I just tried changing the week and it seems to work? Or do you mean to move the crew field down?

OK. More custom CSS:

input[name="_sfm_wpcf-max-number-of-guests[]"] {
  display: inline-block;
}

How does that now look?

This that you have in your CSS:

#top form {
    margin-bottom: 20px;
}

Is making the box taller.