[Support request] Sticky navigation padding

[Michael]

Hi,

I have a full width navigation on this site that has left and right header padding of 40px.

When sticky on desktop is used that padding is removed when the sticky is activated scrolling down the page.

Which class or id do i target to add the 40px padding back in for the sticky nav?

thanks,

[Leo]

Hi there,

This method might works best:
https://docs.generatepress.com/article/navigation-as-a-header/

Let me know if this helps 🙂

[Michael]

Hi Leo, I looked at that method but for a few reasons didn’t go with it.

After a bit more testing I found this code does what I want.

@media (min-width: 769px) {
    .main-navigation.sticky-navigation-transition .navigation-logo img {
        padding-left: 40px;
    }
    .nav-float-right .is_stuck.main-navigation ul {
        padding-right: 40px;
    }
}

Is there anything wrong with using this way?

[Leo]

Hmm looks good I think.

I think this should also work:

@media (min-width: 769px) {
    .main-navigation.navigation-stick .inside-navigation {
        padding: 0 40px;
    }
}

[Author]

Posts