Make logo stick to menu

On large screens the logo detaches pretty far from the nav bar and sticks at the left border of the screen. This looks a bit weird since the logo is aligned on the far left and the menu and the main content are centered. These two parts shouldn’t be so far away from each other. When the user looks at the main content the logo doesn’t really get noticed since it’s located somewhere else.

How is it possible to make the logo stick to the menu bar instead, so they actually belong together? The logo and the nav bar should be one coherent piece ideally.

From what I can tell the part that stretches dynamically seems to be the class:

.header-navbar__start

and the nav bar seems to be styled by this class:

.header-navbar__middle

Thanks for your help guys!

Thank you for waiting. Please try this CSS snippet to start, but it can require further customization. If you are not familiar with the code customization, then please consider hiring someone for custom work https://fvrr.co/32e7LvY

@media screen and (min-width: 1440px){
	.header-navbar{
		justify-content: center;
	}
}
1 Like

Thanks for the pointer. Unfortunately, it didn’t really work for me. However, the following seems to work for most resolutions:

@media screen and (min-width: 1440px){
	.header-navbar__start{
		justify-content: right;
	}
}

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.