Menu search icon position on mobile

I hope you are well today and thank you for your question.

Are you facing any issue on mobile?

If yes then could you please share your site URL where it’s happening so I can troubleshoot it?

Best regards,

Hi. The search icon is placed to far to the right. Looks good on desktop though.

You can resolve this by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Admin Area -> Ivory Search -> Settings -> Settings

@media only screen and (max-width: 1024px){
.hfe-nav-menu li.is-menu {padding-left: 13px;}
}

Thanks! Great addition to your previous CSS code. This worked great:

.hfe-nav-menu li.is-menu {
    padding: 13px 0 0 12px;
}

@media only screen and (max-width: 1024px) {
    .hfe-nav-menu li.is-menu {
        padding: 13px 0 16px 40px;
    }
    .hfe-nav-menu .is-menu.is-dropdown form {
        right: auto;
        left: 0;
    }
    .hfe-nav-menu .search-close {
        right: auto;
        left: -22px;
    }
}

@media only screen and (max-width: 1024px){
.hfe-nav-menu li.is-menu {padding-left: 13px;}
}

You are always welcome, I’m glad I was able to help you with this matter. There is no obligation but by your kind words I wonder if I could trouble you to leave a review based on this experience here:

Click to leave a review

I’d really appreciate that. 🙂

And if I can be of any further assistance please don’t hesitate to ask.