[npangers]

Hi!

I was hoping if there was a plug-in or through CSS to get my logo and menu bar to be on the same line as to having the menu bar below the logo.

[Skandha]

@npangers: Hello there,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#header-content, #header-navigation-area {
    display: inline-block;
}

Let me know if this works out!
Kind Regards,
Skandha

[npangers]

Hi @Skandha

It only works on larger screens when I right click to inspect, but it goes onto the next line in smaller screens. I need both logo and menu on the same line, even when the menu collapses.

[Skandha]

@npangers: Hello there,
Replace the above code by the following.
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

@media screen and (min-width: 1024px) {	
	#header-content,#header-navigation-area {
	     display: inline-block;
	}
}

The menu will overflow to the next line as the screen size decreases as you have a lot of menu items that would not fit beside the logo.

Let me know if the menu looks better now.
Kind Regards,
Skandha

[npangers]

Hi @Skandha

No change with the new code.

[Skandha]

@npangers: Hello there,
With the latest code I provided you the menu looks better on screens below 1024px.

It is not possible to have the menu aligned next to the logo when the screen size decreases as the menu does not fit alongside the logo. So, it overflow below.

Kind Regards,
Skandha

[Author]

Posts