[Resolved] Mobile Bar & Logo Issue

[David]

Hi,

I’m trying to fix my mobile top menu bar.

Screen Shot:

https://cl.ly/47f2648d17a3

I want to move the search icon to the far right, so it does not cover my logo. (and center the menu option)

Can we make the black menu bar thicker, so I can increase the size of the logo ?

P.S – The header padding when the mobile icon is selected, takes no effect no matter what I change it to.
See screen shot: https://cl.ly/9386e34c6c7f

– Using 1.8.1 GP Premium

thanks!

Dave

[Leo]

Hi there,

The overlapping problem is causing by this CSS you’ve added:

.site-logo {
    position: absolute;
    bottom: 0;
}

Don’t think it’s needed? If not can you remove it first?

To make the black bar thicker and logo bigger, try increasing the menu item height with mobile toggle on:
https://docs.generatepress.com/article/menu-item-height-width/

Let me know 🙂

[David]

Awesome! I removed that snip of css, and set the Header Padding to 0 (Bottom)

Can I make that Logo larger now?

I also wanted to see how it would look with Mobile Header = Off … now my logo works well that way also…

But just to be able to pick 1 or the other, if I can make the mobile logo larger – please advise?

thanks!

Dave

[David]

Got it!

[Leo]

Awesome 🙂

[Author]

Posts