Home › Forums › WoodMart support forum › Drop down suggestions inside filters do not appear correctly.

Drop down suggestions inside filters do not appear correctly.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • December 7, 2022 at 6:05 pm #427116

    supp0rt
    Participant

    Hello,

    I have added the product search filter inside the filters sidebar on shop, but when the results appear in the drop-down, they seem a bit off.

    Below you will find a snip of the problem. Also, I have provided admin credentials. Feel free to apply any changes or disable any plugins.

    Let me know how this can be fixed.

    Best Regards

    December 7, 2022 at 6:38 pm #427122

    Luke Nielsen
    Keymaster

    Hello,

    Please enter the below code into the “Global Custom CSS” area in Theme Settings -> Custom CSS.

    .woodmart-ajax-search .search-results-wrapper .wd-dropdown-results {
    left: 0;
    right: 0;
}

    Thanks for your time and have a great day.

    Kind Regards

    December 7, 2022 at 7:42 pm #427132

    supp0rt
    Participant

    Thank you for your answer. The CSS code worked.

    I also noticed in small mobile devices, that the results overflow on the left.

    Can this be fixed?

    Best regards

    December 8, 2022 at 10:12 am #427220

    Luke Nielsen
    Keymaster

    Hello,

    Could you please attach any screenshot for a better understanding?

    I await your response.

    Kind Regards

    December 8, 2022 at 10:35 am #427229

    supp0rt
    Participant

    I have attached an image snip. You can see that the text of some titles overflows to the left a bit.
    It still appears hidden but in some titles/products, it appears like it is cut out.

    Let me know if you need anything else.

    Best Regards

    December 8, 2022 at 4:16 pm #427378

    Luke Nielsen
    Keymaster

    Hello,

    In this case, try to use the below code as well.

    .woodmart-ajax-search .search-results-wrapper  .autocomplete-suggestion .wd-entities-title {
    padding-right: 45px;
}

    If you ever need to reach out to me, please do not hesitate to do so.

    Kind Regards

    December 8, 2022 at 5:04 pm #427402

    supp0rt
    Participant

    Thank you for your answer.
    Can this CSS be responsible for that behavior? 

    autocomplete-suggestions {
       grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
}

    Best Regards

    • This reply was modified 2 years ago by supp0rt.
    December 9, 2022 at 11:07 am #427566

    Luke Nielsen
    Keymaster

    Hello,

    You can try the below one code for that issue as well. Paste it into the “Mobile CSS” area in Theme Settings -> Custom CSS.

    .sidebar-widget.woodmart-ajax-search .search-results-wrapper .autocomplete-suggestions {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

    Kind Regards

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)