Forums › Forums › Search & Filter Pro › How to make the filter on the same line?

Viewing 9 posts - 1 through 9 (of 9 total)
  • Anonymous
    (Private)  April 3, 2016 at 3:14 pm #41399

    Hi Trevor,

    I saw on your FAQ this code to make the filter on the same line :

    .searchandfilter ul li
{
    width: auto;
    display: inline-block;
}
li.sf-field-taxonomy-portfolio_category{display: inline-block !important}
li.sf-field-taxonomy-portfolio_tag{display: inline-block !important}
.searchandfilter h4 {
color: #ff6300 !important;
{

    But I would like to add same space between each menu, like this :

    How can I make it?

    Thanks,
    Benoit

    Trevor
    (Private)  April 3, 2016 at 3:52 pm #41403

    You would need to add some margin on all of them too, like this maybe?

    .searchandfilter ul li {
    width: auto;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
}
li.sf-field-taxonomy-portfolio_category, li.sf-field-taxonomy-portfolio_tag {
    display: inline-block !important;
    margin-left: 10px;
    margin-right: 10px;
}

    The close bracket is also wrong on the last selector that you showed. It should be this:

    .searchandfilter h4 {
color: #ff6300 !important;
}
    Anonymous
    (Private)  April 3, 2016 at 4:50 pm #41408
    This reply has been marked as private.
    Trevor
    (Private)  April 3, 2016 at 5:43 pm #41411

    Hi

    I will need to see a live page then, for me to see the issue.

    Anonymous
    (Private)  April 3, 2016 at 6:02 pm #41412
    This reply has been marked as private.
    Trevor
    (Private)  April 3, 2016 at 6:10 pm #41413

    OK, this might do it:

    .searchandfilter h4, .searchandfilter label {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

    I made this by using Firefox and firebug to inspect and play with the css. It is worth starting to learn to use these tools.

    Anonymous
    (Private)  April 4, 2016 at 9:47 am #41470
    This reply has been marked as private.
    Trevor
    (Private)  April 4, 2016 at 11:41 am #41481

    Can mark this as resolved and close the thread?

    Anonymous
    (Private)  April 4, 2016 at 11:46 am #41482
    This reply has been marked as private.
  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)