CSS filters

Anonymous

#257078

Good Morning,

I need help with the mobile version of our website filters.
I already made some changes but I was not successful.

Can you help me with this matter?

Tks,

Anonymous

#257079

This reply has been marked as private.

Trevor

#257093

Can you show me one or more annotated screenshot(s) of the design change(s) you want? If you can do that, you would need to upload the screenshot image(s) to a file sharing site (like the WordPress Cloudup site) and share the link with me?

Anonymous

#257112

This reply has been marked as private.

Trevor

#257159

In the mobile version, the filters will need to be vertically arranged, not horizontal.

I can see that your theme has a CSS rule that uses flexbox to make them horizontal. At some point you need to set the content into a column. Use this custom CSS maybe:

.fusion-content-widget-area .widget .searchandfilter select.sf-input-select,
.fusion-content-widget-area .widget .searchandfilter label {
    width: inherit;
}
.fusion-content-widget-area .widget .searchandfilter > ul > li {
    min-width: 200px;
    margin-right: 20px;
}
@media only screen and (max-width: 991px) {
  .fusion-content-widget-area .widget .searchandfilter > ul {
    flex-direction: column;
  }
  .fusion-content-widget-area .widget .searchandfilter > ul > li {
    margin-right: 0;
    margin-bottom: 20px;
  }
  .fusion-content-widget-area .widget .searchandfilter .search-filter-reset {
    margin: 0;
  }
}

Anonymous

#257194

This reply has been marked as private.

Trevor

#257196

Thanks for getting back to me. I will close this thread for now.

[Author]

Posts