problem with "search" bar on the header

Activello
1

Hello,
just a small issue that happens with small screen devices such as the iPhone 5S and similars:

as you can see from the screenshot, the search bar is under the menu bar wasting a lot of space. This doesn’t happen with bigger screen devices (iPad, iPhone 6, iPhone 6Plus, etc).

is there any way to solve that?

thank you very much
Joe

2

Hi Joe,

Thank you for your question.

It is displaying fine for me on my test site as shown in the attached screenshot.

Could you please share me your site URL where it’s displaying so that i can test it?

Kind Regards,
Movin

3

hello Movin and thanks for your prompt reply.
this is my website address:

the issue appers only on 4" screen iPhones as far as I know
thanks

4

You can try resolving it by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Activello Options -> Other -> Custom CSS


@media (max-width: 375px) {
.nav-search input {
    max-width: 80%;
}
}
5

hello thank you for your prompt reply! unfortunately that code didn’t improve the situation :frowning:

6

I don’t see that code on your site site page source.

After using that code please clear the cache from WP Super Minify plugin that you are using on your site.

Also clear your browser cache.

7

Hello Movin, yes sorry since it wasn’t working after testing it I deleted that code.
Now I’ve put it back in the custom CSS and flushed the cache.
Would you mind having a look at the website on more time?
thank you so much for your effort.

regards
Joe

8

Yes the code appears on your site now but please add it at the top of the custom CSS code and then test it after clearing the cache.