Urgent help needed for menu section

Hi There,

I urgently need help with a website that i’m building please :slight_smile: my client would like the menu section (the white section) to be as narrow as it is now as shown below:

However I know the menu section affects the logo size and she does the want the logo bigger, but if I change the size of the logo then the white menu section gets bigger which she does not want. She is willing to have the logo overlap over the header picture so long as the white menu section stays small and the logo is larger than it is now so its visible. Is there any chance I could do this?

The URL is: www.no1va.com

Many thanks :slight_smile:
Best,
Mel

Hello Mel,

Try adding this simple CSS code to Appearance > Customize > Additional CSS from dashboard.

    .site-header > .container-fluid {
      position: relative; 
    }

    .site-header .custom-logo-link {
      position: absolute; 
      top: -10px;
      left: 0; 
    }

    .site-header .custom-logo-link img.custom-logo { 
      max-height: 120px;
    }

Regards,
Kharis

Hi Kharis,

Many thanks for your kind help I really do appreciate it.

The web version is perfect now :slight_smile: just the mobile version does not look so great as the logo is very small. Is there any way I can maybe fix this mobile version?

Many thanks

Mel

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 1020px) {
      .site-header .site-branding .custom-logo {
        max-width: 100%;
      }
    }

Regards,
Kharis

Hi Kharis it worked so well thank you so much :slight_smile:

Have a great day

Best,
Mel

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis