- This topic has 9 replies, 3 voices, and was last updated 7 years, 2 months ago by
.
-
Posts
-
I used the CSS from this thread to have the logo floated left and the main navigation centred. I’ve got a secondary menu to display a phone number floating right.
The problem is I’m using sticky navigation so, as soon as you scroll, the secondary nav is gone. I believe the solution is to move the secondary navigation inside the main navigation. I tried the code snippet from here but there appears to be no effect.
Customer Support
Hi there,
Have you solved this?
The menu items are exactly the same in static and sticky mode.
Let me know 🙂
Hey Leo. No, I’ve set it back to normal so it doesn’t bother me while I’m trying to figure it out (:
Also, I decided I don’t want to use up the secondary navigation just for the phone number because I think I may need it for another purpose. I’m hoping to be able to centre all the navigation items except for the last one—the phone number—which should align right.
What if you set the navigation to be center and use this method for the float right items?
https://docs.generatepress.com/article/adding-icons-to-menu-items/#floating-the-icon-to-the-rightI would try that but it doesn’t appear to be an option. In the Customizer, Navigation Alignment gives you Left, Center or Right. Selecting any of those has no effect that I can see. The Navigation Position option is set to Float Right, which is the only option to position the navigation to the right of the logo.
I don’t see any overriding CSS that is not allowing the navigation to sit centred.
Customer Support
Hi there,
you can try this:
.main-navigation ul { display: flex; } .main-navigation li:first-child, .main-navigation li.nav-phone { margin-left: auto; }Only thing is you may notice movement in the nav when it goes to sticky. Issue is because where jumping from one nav layout to another. Let me know.
That’s almost got it David but it only works when the the nav goes sticky. Trying to figure out what changes because your css is still applied.
You would need to use the Nav as the header as it won’t work with a floated navigation in the header:
https://docs.generatepress.com/article/navigation-as-a-header/
Hot dog! I didn’t know that was a feature. That’s done it. All I have to do now is adjust a bit of CSS and I’m set. Thanks David (:
Awesome. Glad we could be of help.
- You must be logged in to reply to this topic.
