Search Results for '.searchandfilter custom css'

[Trevor]

You would need to use Custom CSS. There are many code snippets in the forum (found by searching for horizontal CSS, but this is what I normally start with:

.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
  float: left;
}
.searchandfilter > ul > li:last-child {
  margin-right: 0;
}
.search-filter-results {clear: both;}

[Trevor]

OK. We may end up discussing this on Skype if this is possible, but for now can you try adding this custom css to your theme:

.searchandfilter-date-picker {
  cursor: pointer;
}

[Trevor]

If you mean in the field Behandlungsmethoden, then try this custom CSS:

.wpb_text_column .searchandfilter :last-child {
  margin-bottom: 0;
}

This will overcome what either you or your theme or another plugin has added.

[Trevor]

You would need to use Custom CSS. There are many code snippets in the forum (found by searching for horizontal CSS, but this is what I normally start with:

.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
  float: left;
}
.searchandfilter > ul > li:last-child {
  margin-right: 0;
}
.search-filter-results {clear: both;}

[Trevor]

You would need to use Custom CSS. There are many code snippets in the forum (found by searching for horizontal CSS, but this is what I normally start with:

.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
  float: left;
}
.searchandfilter > ul > li:last-child {
  margin-right: 0;
}
.search-filter-results {clear: both;}

[Anonymous]

Hi Guys, no matter what I try I can’t get my form fields to behave according to my custom css as follows;

.searchandfilter select.sf-input-select {width:100% !important; height:auto; margin:0px 0px 8px 0px; padding:10px; border:4px solid #f37021;}
.searchandfilter input[type=text].sf-input-text {width:100% !important; height:auto; margin:0px 0px 8px 0px; padding:10px; border:4px solid #f37021;}
.searchandfilter select {width:100% !important; height:auto; margin:0px 0px 8px 0px; padding:10px; border:4px solid #f37021;}
.searchandfilter input[type=text] {width:100% !important; height:auto; margin:0px 0px 8px 0px; padding:10px; border:4px solid #f37021;}

Text field won’t go full width and select fields resize on ajax refresh depending on what values are in them, nothing is adhering to the 100% width rule at all, any ideas? No theme css conflicts that I’m aware of, what am I missing?
Thanks
Matt

[Trevor]

You want the scrollbar?

It is made so with Custom CSS:

.searchandfilter > ul > li[data-sf-field-input-type="checkbox"] > ul, .searchandfilter > ul > li[data-sf-field-input-type="radio"] > ul {
    max-height: 150px;
    overflow: auto;
}

And to make it multiselect the Search Operator AND (as in your screenshot) is set to OR.

[Trevor]

You would need to use Custom Css. There are many code snippets in the forum (found by searching for horizontal CSS, but this is what I normally start with:

.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
  float: left;
}
.searchandfilter > ul > li:last-child {
  margin-right: 0;
}
.search-filter-results {clear: both;}

[Trevor]

Making the search bar horizontal will require some custom CSS. The precise CSS required will depend on the style you need to match your theme. I can give you general pointers in how this is done, be referring to code snippets on this forum. You can search for horizontal CSS, but this is the typical base CSS required:

.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
  float: left;
}
.searchandfilter > ul > li:last-child {
  margin-right: 0;
}
.search-filter-results {clear: both;}

As to the appearance of results, are you able to send me a live link/URL to your search page so I can take a look?

[Trevor]

It does not, no. Instead, the container has a max-height and overflow set to auto using this custom CSS:

.searchandfilter > ul > li[data-sf-field-input-type="checkbox"] > ul, .searchandfilter > ul > li[data-sf-field-input-type="radio"] > ul {
    max-height: 150px;
    overflow: auto;
}