Hamburger Menu alignment dropping below logo on mobile views

[HighTechDad]

For the life of me (and I’m not good with CSS), I have had this issue bug me for a LONG time. My menu on the desktop view is great (using UberMenu integration) but when I go to a mobile size (tablet/smartphone), while my logo displays fine, the hamburger menu drops down (almost like a line break happens) and it pushes my header down considerably.

Ideally what I want is for the hamburger menu to be inline with the logo (logo left aligned and menu right aligned) and not have so much wasted header space.

Site is: https://www.hightechdad.com

Thank you much! I will continue exploring the code (but I’m really sure it’s an easy fix!).

[HighTechDad]

I was looking through some other threads and found some CSS that I modified to match what I was looking for, specifically:

body .ubermenu-responsive-toggle.ubermenu-responsive-toggle-main {
    margin-top: -75px;
	  margin-right: -20px;
}

Is this what you would recommend?

I have actually implemented on my site. Seems to look better.

[ruenel]

Hello There,

Thanks for writing in! I have checked your site and this is what I am seeing:

It seems that the code perfectly works for you.

If you need anything else we can help you with, don’t hesitate to open another thread.