Header not responsive

Hi there,

The header on screens smaller than 15 inch isnt responsive. The menu items go through the logo and will not resize. See: http://home-exclusivo.com

How can I fix this?

Kind regards,

Gino

Hi,

This header layout is not designed for headers with a small number of menu items. It is natural that they don’t look well because they don’t have enough space on a smaller screen. If you want, we can give you a custom CSS code to decrease menu font size and spacing to free some space.

Regards

Hi there,

Yes please.

Kind regards,

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

@media (max-width: 1380px) {
	.main-nav ul.menu>li>a {
		font-size: 12px;
		padding-left: 5px;
		padding-right: 5px;
	}
	
	a.basel-logo img {
		max-width: 180px;
	}
	
	.main-nav ul.menu {
		margin-left: -130px;
		margin-right: -144px;
	}
}

Regards

It worked perfectly

Thank you very much!

You are welcome!

[Author]

Posts