Archived topic
Adding a gradient border at the bottom of the navigation menu
3 replies · Started by gleb on October 5, 2022
Hello,
I want to add a gradient border underneath my main navigation menu to create a visible separation from the content. Here's a great example of what I want to do: https://www.leafly.com/news/cannabis-101/what-is-thcv-and-what-are-the-benefits-of-this-cannabinoid
You can see there's a dark grey-to-light gray gradient border under the navigation. I imagine I need to add some kind of gradient/background CSS to my header or nav menu div.
Would appreciate any help
Hello Gleb,
First, in the customizer go to Layout > Header and make sure the Header width is set to Full and Inner Header Width is set to Contained.
Once that is done add this custom CSS:
.site-header {
box-shadow: 0 4px 8px rgba(0,0,0,.16);
}
Hope that help.
Worked like a charm, thanks
Cool, glad I could help. Have a great day!