Mobile Menu and Logo Positioning

[tsimarketing]

I am trying to get the mobile menu and logo positioning looking nice on mobile view. I have attached two screenshots of what they look like on a iPad and on a phone. I like how the logo is positioned to the left and the mobile menu to the right on the iPad. So I have two questions:

1. For the iPad view is there a css code that I can use to make the mobile menu vertically centered? Because right now it has too much padding on the bottom of the icon.

2. For the mobile/phone view is there a code that I can use to get the logo positioned to the left and the mobile menu positioned to the right, like on the tablet view?

Basically I want it to look like the positioning on your Dante website in mobile view and I don’t want any of this to mess up the desktop positioning.

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

@media only screen and (max-width: 767px) {
#header-section #header{
padding:10px 12px !important;
}
}

Thanks
Mohammad

[tsimarketing]

I tried this code but it did not work. The mobile menu icon and logo did not move on the phone view and the mobile menu icon is still not centered vertically on the tablet view. I even tried changing the padding numbers and it did nothing.

[tsimarketing]

Actually nevermind, it works now because I added it to the top of my custom css. So now I would like to know how to make the menu icon centered vertically. I have attached a screenshot

Also is there a way to change the size of the logo on phone view, not tablet view(it looks great on tablet or ipad view)? Because as you can see from the screenshot, the logo is kind of big and seems to be adding some padding between itself and the header.

Attachments:

You must be logged in to view attached files.

[Swift Ideas – Ed]

Hi there,

Add this custom css:

#logo a.mobile-menu-show {
margin-top: 12px;
}

Hope that helps.

– Ed