[Support request] Sticky menu – Apple

[isabel]

Hi,

We are using the sticky menu with the secondary menu. In Android and PC is working well.

But it is not sticky in the posts in:

Ipad and iPhone Safari.
Ipad Chrome neither.
Chrome or safari from the Macbook.

My CSS:
#secondary-navigation {
position: sticky;
top: 0;
}

Could you give me any advice? Thank you!

Best regards.

[David]

Hi there,

try this CSS:

#secondary-navigation {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

This will cover the webkit browsers

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

[acela]

Hi David,

In testing, I’m also not seeing my sticky navigation menu bar appear when scrolling down on iPad Safari… Is this still the right CSS to use/add?

Thanks!

[David]

Hi there,

that code is still valid – it may require some z-index property but if you can raise a new topic and share a link to the site I can take a look.

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

[acela]

Yep, that did the trick – and no z-index needed… Thanks David!

(Perhaps these rules should be in the default sticky-nav setup?)

[David]

We’ll be rewriting sticky nav soon – so we’ll take a look at some other options.

Glad to hear you got it working!

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

[Author]

Posts