I am using a modular theme for my website and want the space where my logo and main menu to be white

I am using a modular theme for my website and want the space where my logo and main menu to be white background instead of being right above my large image. Is there a way to add it? Thank you! I added an example of what I want.

Hello There,

Please share your store URL and password in case it’s password protected.
So that I will check and let you know the exact solution here.

Hi @jmoon1 ,

Please follow the steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.

  • Step 2: Go to Assets > theme.css and paste this at the bottom of the file:

.shopify-section-header{

position: relative !important;

}

.site-header{

position: relative !important;

color: var(—color-text) !important;

}

1 Like

It worked! Thank you! Is there a way to control the size of this site header?

Hi @jmoon1 ,

You just need to add the code:

.site-header{

// for desktop

height: 80px !important;

}

@media screen and (max-width: 767px){

.site-header{

// for mobile

height: 50px !important;

}

}

Thank you for the help. I will give it a try and let you know!