[Anthony Lazare]

Hello,

When you go to my website at https://unplugspot.com?bypass=comingsoon and click on the search icon, you’ll see that the search box and text blends into the hero image and is hard to see.

Can you tell me what CSS I need to add to make that stand out?

Thanks!
Tony

[Skandha]

@tlazare: Hello Tony,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#site-navigation #search-container {
    background-color: #000;
}

You can change the color according to your choice.
Let me know if this works out!
Kind Regards,
Skandha

[Anthony Lazare]

Thank you Skandha, that worked perfectly. Can you tell me how to change the background of the mobile drop down menu as it has the same issue that the search box had.

Thanks again for all of your assistance. Just made the site live and the menu issue seems to be the last hurdle!

[Skandha]

@tlazare: Hello Tony,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#header-navigation-area .menu-inside-wrapper {
    background-color: #3d3d3d;
}

You can change the color according to your choice.
Let me know if this works out!
Kind Regards,
Skandha

[Anthony Lazare]

IS it possible to only set the background color when the menu is expanded in the mobile view? That is when it is hard to see over the header image. When in desktop mode, I’d like to leave it as is.

Thank you Skandha!

[Skandha]

@tlazare: Hello Tony,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code instead.

#header-navigation-area .menu-inside-wrapper {
	background-color: #3d3d3d;
}
@media screen and (min-width: 1024px) {
	#header-navigation-area .menu-inside-wrapper {
	    background-color: unset !important;
	}
}

Let me know if this works out!
Kind Regards,
Skandha

[Anthony Lazare]

That worked perfectly. Thank you!

[Skandha]

@tlazare: Glad it worked out. Have a good day! 🙂

Kind Regards,
Skandha

[Author]

Posts