-
Like my super long title says, there’s a few items I’m trying to do but can’t seem to get them all to work. I’ve searched the forums but I seem to be finding items that conflict or not exactly what I would like to do. I’ve outlined below in hopes its simpler than what I am trying to do.
A few notes:
1. I have a 2 row header, first row contains my logo (centered), and primary nav sits below. This is important because when I follow the instructions here by using “navigation as a header”, it breaks this look. See image linked for example.1. Right Align Search.
I am trying to get the search icon/button to always be right aligned. The Primary Nav would then be center aligned on my regular desktop view.
2. On Sticky Menu, when I scroll down the page, I get the logo, primary nav, and search all center aligned. I would like to break this up so that its:
– Logo = left aligned
– Primary Nav = Center aligned
– Search Icon = Right aligned.
– Is is what I would like my end result to look like when in sticky nav.
Thank you!
-
Hi there,
Can you link me to your site?
-
Link is here: https://protoolio.com/lnk/1291801
-
Let’s solve one thing at a time:
1. Right Align Search.
Can you try this CSS?
@media (min-width: 769px) { #site-navigation .menu-bar-items { position: absolute; right: 0; } }Learn how to add CSS: https://docs.generatepress.com/article/adding-css/
-
Thank you, this works! However, when the sticky nav comes in, its goes back to center.
-
Hi there,
Try adding this CSS:
nav.is_stuck .inside-navigation { justify-content: space-between; } -
Awesome! it works. Thank you!
-
You’re welcome!
- You must be logged in to reply to this topic.