Archived topic
Navigation as header alignment with content
7 replies · Started by Paul on September 22, 2020
When using navigation as site header, how can I keep the logo and menu aligned with content as the screen size reduces? Same for the footer with copyright content and a menu added to the footer bar widget.
Container alignment is set to boxes.
Thanks,
Paul.
Hi there,
Any chance you can link us to the site in question?
You can use the private information field.
Let me know :)
Yeah, added below.
Just to confirm, you are happy with the desktop layout:
https://www.screencast.com/t/GtVtcE8fdB
But want to move the logo in to align with the title Home on smaller screen?
https://www.screencast.com/t/0c9YBRYtx
Yeah that's right! A fix for that would be great.
Can I ask as well (can open a new question if needed)...If the primary nav was centered, is there a way to have the logo and menu items fill the available space? Flexbox?
I appreciate that's a different question to my original one.
Thanks,
Paul.
Give this CSS a shot:
@media (max-width: 1110px) {
#site-navigation .navigation-branding, #sticky-navigation .navigation-branding {
margin-left: 40px;
}
}
A new topic for the separate question would be appreciated :)
I might need to add a min-width too but that works yeah, thanks.
No problem :)