Archived topic
sticky navigation logo
12 replies · Started by Gonzalo on January 17, 2020
Hi there!
to scroll down with sticky navigation, I need the same image feature like original logo page.
I use this custom css:
.site-branding, .site-logo {
position: absolute;
z-index: 200;
top: 5%;
}
Can you help me?
Regards
hey
Maybe this link help you
https://docs.generatepress.com/article/navigation-logo/
thank you kobi, but not work with this info :(
Gonzalo
You are using GP Premium?
absolutely yes ;)
Hi there,
That's a bit of a tricky one.
What if you used the "Navigation as Header" option?: https://docs.generatepress.com/article/navigation-as-a-header/
It will likely take some tweaking, but that along with the "None" sticky navigation effect should be the solution.
thank you. But the issue it's about float logo.
I need this:
https://prntscr.com/qq99zx
to scrool:
http://prntscr.com/qq9asn
it's just a css detail ;)
You could try this:
.navigation-branding {
position: absolute;
z-index: 200;
top: 5%;
width: 100px;
}
.navigation-branding img {
height: 100px;
}
.navigation-stick #primary-menu {
margin-left: auto;
}
However, you'll likely end up with a better result if you use the method I mentioned above :)
thank you Tom, Navigation as Header in this site no work.
I have another GP site, working fine with this logo scroll down issue:
https://velvetconsultores.com/
I use the same css, but nothing happens :/
Regards
Hi there,
I'm not seeing the CSS I provided on your site - where did you add it?
Let me know :)
Tom, please check it again :)
I add a little change in you css:
.navigation-branding {
position: absolute;
z-index: 200;
top: 5%;
width: 100px;
}
.navigation-branding img {
height: 100px !important;
padding: 2px 0 0 0;
}
.navigation-stick #primary-menu {
margin-left: auto;
}
Working, thank you for your help!
Regards
No problem! :)