Mobile menu layout help and menu breaking points for desktop

Now try adding this CSS:

.mobile-header-navigation .mobile-header-logo {
    max-width: 50%;
}

.mobile-header-navigation .mobile-header-logo img {
    height: auto;
}

#mobile-header>.inside-navigation {
    align-items: center;
}

Hi Tom,

That works now!

Thank you.

You're welcome :)

Hi @Tom, I have run into a small problem regarding the mobile menu layout. Namely, the menu item with a sub-item has a weird click box on mobile. I'm not sure how to fix it with css. All the other menu items I have managed to get in order.

Can you help me?

Hi there,

its because of this CSS:

#menu-main-menu-1 li{
	height: 65px;
	text-align: right !important;
}

#menu-main-menu-1 > li:nth-child(2) > a:nth-child(1){
	height: 65px;
}

if you swap height: 65px; for line-height: 65px; then the text will be vertically centred within the menu item.