[Resolved] Sticky Navigation with Full Width Header

[Ari]

Hi,

Is sticky navigation always contained? As I have header set to full width and main navigation behaves correctly, but some javascript (?) is changing the width of Sticky Navigation.

Any ideas, something wrong in my setup or a bug? Link is in private information field.

BR
Ari

[Leo]

Hi there,

Can you try this option first?
https://docs.generatepress.com/article/navigation-as-a-header/

I believe it should work for the layout you are after.

Let me know if this helps 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Ari]

Hi,

Thanks for reply. I managed to get it work, but with some manual CSS. I had to replace:

.main-navigation .main-nav ul li a, .menu-toggle, .main-navigation .menu-bar-item > a {
line-height: 100px;
}

with (in Customizer CSS):

.main-navigation .main-nav ul li a, .menu-toggle, .main-navigation .menu-bar-item > a {
line-height: 60px;
}

Otherwise only logo collapsed (different height), but otherwise menu had still the same height. Main menu height is set now 100 px and sticky menu 60 px. No sure, but perhaps related to Search in menu, that seemed to keep 100 px height although 60 px set in Sticky settings.

BR
Ari

[Leo]

Yes that’s a bug currently.

Your CSS fix is perfect 🙂

We have it fixed in the next version of GPP so you can remove the CSS once we release the update.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Ari]

Hi,

Thansk for confirming, waiting for the fix 🙂

BR Ari

[Leo]

No problem 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jason]

Curious if this has been fixed. It’s still not working for me.

https://gf.j2test.com/index.php/sample-page/

Thanks,

[David]

Hi there,

temporarily change the Customizer > Layout > Primary Navgation >> Location to Below Header, this will unlock the Width and Inner Width options. Set both of them to Full. Then put the Location back to Float Right. The Sticky Navigation will respect those full width settings.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts