[Andrew]

Hello,

I’ve tried just about everything in the Theme Color Customization tab. I want a black background on the menu dropdowns. Currently they’re white and washing out the white text color of the menu.

Here is my site URL: http://www.edgewithandy.com/

[tikaram]

@edgewithandy : Go to Appearance => customize => Additional css and add the following css. Let me know if this helps you out

.navigation-classic .main-navigation ul ul {
	background-color: #000;
}

Regards,
Tikaram

[Andrew]

That did the trick! thank you.

[Andrew]

Your code fixed the web version but not the mobile version. Do you have a code that would also change the background color of the menu on mobile devices?

[tikaram]

@edgewithandy :I checked your site on mobile device as well. I don’t seem to find any issue with the mobile version as well. Please try clearing cache at your end and let me know.

Regards,
Tikaram

[Andrew]

I would like to use a dark header image as shown on my website with white menu text and white background color. However, when I change the site background color to white.. the navigation menu background is also white. You gave me a code which changed the white navigation background to black on desktop… however, the navigation menu color is still white on mobile device.

Apple iPhone 8 Plus using Chrome & Edge both show white.

This causes the white menu text so not be seen as it’s also white.

Can you provide a fix? see edgewithandy.com

[tikaram]

@edgewithandy : Login to your WordPress admin
Go to Appearance => Customize => Additional css and add the following css

@media only screen and (max-width: 1200px) {
	.menu-inside-wrapper {
		background-color: #000000;
	}
}

Let me know if this resolves your issue.

Regards,
Tikaram

[Andrew]

Yes that worked! thank you.

This is what my current Custom CSS looks like. Is this ok? or is there a cleaner way to write this overall code? Just want to be sure it’s the way it should be now…

.navigation-classic .main-navigation ul ul {
background-color: #000;
}

@media only screen and (max-width: 1200px) {
.menu-inside-wrapper {
background-color: #000000;
}
}

[tikaram]

@edgewithandy : It looks fine. Let me know if you have any more issues.

Regards,
Tikaram

[Author]

Posts