Page Menu and margins all messed up

Hi There,

I really need your expertise :slight_smile: something is so very messed up on my site (and I am sure that I probably messed this up). I tried to create custom headers with javascript but realised that it did not look good on mobile or ipad, so I deleted all of that. But now that I look at the pages the margins and all the content pull right into the menu and I can’t figure out what is going on :cold_sweat: It looks like this right now:

These are all the affected pages:

https://esteemedassist-salma.com/about-me
https://esteemedassist-salma.com/price-plans
https://esteemedassist-salma.com/solutions
https://esteemedassist-salma.com/faqs
https://esteemedassist-salma.com/my-blog
https://esteemedassist-salma.com/get-in-touch

I just want to create a normal menu section but need to figure this out :frowning: Any help would be super appreciated :pray:t2:

Best,
Mel

Hello Mel,

You can try to change Top level menu items color in the Customize → Colors → Header section, and increase Page wrapper - top padding value in the Customize → General section.

Kind Regards, Roman.
aThemes Support

Hey There Roman

Ahhh yes thats it thank you :slight_smile: Just one last thing. I did not want to create a new topic because this is still got to do with the menu. I am trying to make the menu color a solid color but nothing happens :frowning: it just remains white and I do want a sticky menu. Here is to show you that I am clicking on the right section (I hope :slight_smile:

The URL is: www.esteemedassist-salma.com

Many thanks as always

Best,
Mel

Hello Mel,

Header is transparent on top by default, but you can try to add this CSS code in Customize → Additional CSS section to set a color (you can replace black with any other color or color code):

header#masthead.site-header {
    background-color: black;
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.
aThemes Support

Hi Roman,

You are an absolute star! Thank you so much! Just one last question I promise. This is the perfect solution for all the pages. The only trick I need to figure out, is I want the black masthead for all the pages only and then the home page to stay as is so the homepage I want to look like it is right now:

But the singular pages I want the black masthead for

Thank you again I am so grateful to you always

Best,
Mel

Hello Mel,

Try to use this CSS code instead of the previous one:

body:not(.home) header#masthead.site-header {
    background-color: rgba(0,0,0,0.9);
}

body.home header#masthead.site-header {
    background-color: transparent;
}

body.home #mainnav ul li a,
body.home #mainnav ul li::before {
    color: #1c1034;
}

Kind Regards, Roman.
aThemes Support

Hi Roman,

You are a HERO thank you :slight_smile: All sorted now, so much appreciated :slight_smile:

Have a great weekend

Best,
Mel

1 Like

You are welcome Mel!

And have a nice weekend as well :slight_smile:

Kind Regards, Roman.
aThemes Support