Support Forums

Looking for support? You can access the support system via your account.

Forums Forums Search & Filter Pro Customize Search and Submit Design

Viewing 10 posts - 1 through 10 (of 16 total)
  • manos666 bass
    #214518

    Greetings,

    Is there a way to customize the design of the search and submit section, regarding the colors, borders width or length?

    Thank you in advance!

    Trevor Moderator
    #214540
    This reply has been marked as private.
    manos666 bass
    #214556

    Thank you for your immediate response!

    That's how it currently appears

    This is how I want it to look

    I can’t edit the boxes separately, CSS changes the whole section.

    In case you can’t see the CSS screenshot I shared, the CSS code is:
    .searchandfilter > ul > li {
    display: inline-block;
    vertical-align: top;
    padding: 0 0px;
    }

    Thank you in advance!

    manos666 bass
    #214558

    In my last post, “that’s how it currently appears” should be above another screenshot of my website that has one box for text search and a category drop down box with different height and default design.

    How can I customize them separately ? Because this custom CSS in elementor only lets me edit the whole section.

    Trevor Moderator
    #214679
    This reply has been marked as private.
    manos666 bass
    #214769

    Here is the screenshot of my Website’s search page: https://ibb.co/4Sv82dD

    Trevor Moderator
    #214788

    Thank you. It is possible, but as I have said before, I need the live link/URL to your search page so I can take a look and write the CSS for you.

    manos666 bass
    #214851

    Sorry for the misunderstanding, here is the live link to my search page: http://18.196.163.150

    Trevor Moderator
    #214887

    Does this custom CSS help:

    .searchandfilter > ul {
      display: flex;
    }
    .searchandfilter > ul > li.sf-field-search {
      flex-grow: 0;
      min-width: 190px;
    }
    .searchandfilter > ul > li.sf-field-search input {
      padding: 13px;
    }
    .searchandfilter > ul > li.sf-field-category {
      flex-grow: 1;
    }
    .searchandfilter > ul > li.sf-field-submit {
      flex-grow: 0;
      min-width: 165px;
    }
    .searchandfilter > ul > li.sf-field-submit input {
      padding: 20px 40px;
    }
    Trevor Moderator
    #214889

    I re-posted the CSS, as a bit was missing.

Viewing 10 posts - 1 through 10 (of 16 total)

You must be logged in to reply to this topic.