Customize the layout of search form and search results

Anonymous

#177197

Yes, I did. It works perfectly on the tab widget’s default color scheme. However, when I switch to another color scheme, it seems to be that the that plugin used another .wpt_widget_content: https://mykitchenbeta.000webhostapp.com/site-search

Trevor

#177199

Fixed with this:

.wpt_widget_content .tab-content .searchandfilter ul li.sf-field-reset,
.wptp_widget_content .tab-content .searchandfilter ul li.sf-field-reset {
  width: 75px;
  display: inline-block;
  margin-right: 50px;
}
.wpt_widget_content .tab-content .searchandfilter ul li.sf-field-submit,
.wptp_widget_content .tab-content .searchandfilter ul li.sf-field-submit {
  width: 75px;
  display: inline-block;
}
.wpt_widget_content .tab-content .searchandfilter ul li.sf-field-reset input,
.wpt_widget_content .tab-content .searchandfilter ul li.sf-field-submit input,
.wptp_widget_content .tab-content .searchandfilter ul li.sf-field-reset input,
.wptp_widget_content .tab-content .searchandfilter ul li.sf-field-submit input {
  width: 75px;
  background: #666;
  color: #fff;
}
.searchandfilter > ul > li select {
  width: 200px;
}
/* the next is 200px-(2*12px padding) - (2*1px border) */
.searchandfilter ul li.sf-field-search input {
  width: 174px;
}

Anonymous

#177201

wow, you really are an expert. You do very fast and extremely accurate. Thank you for everything 🙂

Trevor

#177217

Hopefully you can see in this CSS where you can change colors and widths. Is it OK to close this thread for now?

Anonymous

#177219

Yes, everything is clear now. Thanks again 🙂

[Author]

Posts