[Resolved] sticky navigation width

[Gurer]

Hi,
I want to make the sticky navigation full width same as my header. Is there an option?
Thanks

[David]

Hi there,

there is an option but it gets hidden, so follow these steps:

1. Go to Customizer > Layout > Primary Navigation.
1.1 switch the Navigation Location to Below Header ( this is a temporary change ).
1.2 You will now see above the Navigation Width and Inner Navigation Width. Set the former to Full Width:

https://docs.generatepress.com/article/primary-navigation-layout-overview/

This gets applied to the Sticky Nav as well.

1.3 Now change the Location back to Float Right.

[Gurer]

Done perfect!
But there is a slight padding difference between sticky and header now, how can I equalize this?
Many Thanks

[David]

If you don’t want to adjust the Customizer > Layout > Header –> Padding then use this CSS:

.main-navigation.is_stuck .inside-navigation {
    padding: 0 40px;
}

That will add the 40px padding to the stick nav.

[Gurer]

Perfect, thanks.

[David]

You’re welcome

[Author]

Posts