-
Hello, I want the header area to appear as follows: 1) left side: logo, 2) right side: text or image on top and primary navigation underneath. (I’m doing separate posts for two questions I have about this.)
My question for this post is: How do I align the primary navigation menu items so they appear lower (they currently appear to be centered vertically)?
Two notes:
1. My first thought was to align them to the bottom. But I’m not sure how that will look relative to the logo, so I might want to tweak the location so that the bottom of the nav menu items aligns with the bottom of the logo–but if that’s an issue, maybe it’s easier to change size the logo rather than tweak the location of the nav items?2. I want to keep the result responsive in terms of looking good on desktop and mobile.
Thank you.
-
Hi there,
can I see your site ?
-
Hi. Sure, [EDIT: moved to private section]. (It needs a lot of work.)
-
If you want to simply move the menu to align with the bottom of the logo then try this CSS:
@media(min-width: 769px) { .site-header .inside-header { align-items: flex-end; } #site-navigation { position: relative; bottom: -20px; } }It you need something above the navigation, then we can look at that in the other topic.
-
David, thank you! It looks great!
-
You’re welcome
- You must be logged in to reply to this topic.