Archived topic
How to make mobile top bar stick in addition to menu
7 replies · Started by Katja on July 31, 2018
Hello,
I would like to make the top bar on a mobile screen sticky in addition to the main menu that is currently sticky. I seeem to remember reading something about sticking additional elements but can't find it now. Obviously the main menu would need to sit underneath the top bar to form one visual unit.
Many thanks for any help.
Have updated as requested. Thanks.
Hi there,
are you able to share a link to your site? you can edit your original topic and use the Site URL field for privacy.
Thanks for the quick response. Have updated as requested.
A bit experimental but we could try this CSS:
.top-bar {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 200;
}
.sticky-enabled .main-navigation.is_stuck {
top: 49px !important;
}
@media (max-width: 495px) {
.sticky-enabled .main-navigation.is_stuck {
top: 41px !important;
}
}David, thanks again
I won't be able to check this out til Friday morning CET so will get back to you then and hopt to mark as resolved.
You're welcome. Keep us posted.
David,
just wanted to let you know that the CSS you supplied worked a treat. Thanks for your help.
The GeneratePress theme is such a great and easy to use package that I have hardly ever needed to use the support. But on the rare times I have you guys have been very quick to respond with immediate solutions to my question. Thanks for the great product and the support.
Roger
Awesome. Glad to hear it worked!
And thank you for the kind words, Tom and Leo set a might high bar when it comes to support, glad we can deliver on that!
