[Resolved] How Do I Make My Primary Navigation Look Like This?

[Robin]

Hey there – I am trying to make my primary navigation look like this:

https://nosidebar.com/claiming-quiet-in-a-loud-world/

I really like the grey shading bar underneath the menu items.

Any ideas about how I might achieve this?

TIA

Robin

[David]

Hi there,

try this CSS:

.main-navigation {
    position: relative;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.45);
    z-index: 1;
}

More info here on the box-shadow property – to help with any adjustments you might want to make:

https://www.w3schools.com/cssref/css3_pr_box-shadow.asp

[Robin]

Many thanks David. Enjoy your weekend.

[David]

You’re welcome. You too.

[Author]

Posts