Archived topic
Site Title, Logo and Navigation
6 replies · Started by Matthew on July 17, 2017
Hi,
I'm having trouble getting my site title, logo and navigation to line up. I've currently reverted to having just my site title and logo in the header but would prefer all three (Logo, Site Title, Navigation).
As you can see from my site (www.citizens800.org) the site title would look better centred on the vertical axis but I don't know how to do that.
Also, when I tried moving the navigation in line with the Site Title, to enable me to try merging the page header with the navigation, the navigation kept looking at though it was on a line below the Site Title. Again, not sure what settings I need to change to achieve this.
Any advice would be very welcome.
Thanks
Matt
Hi there,
Try removing this CSS:
.site-logo {
float: right;
margin-right: 20px;
}and use this: https://docs.generatepress.com/article/putting-site-title-next-logo/
Then set navigation location to float right: https://docs.generatepress.com/article/navigation-location/
You might need to increase the container width in order to fit all three elements though. Or decrease the site title font size.
I've tried this but as you can see from the screen shot at the link below I'm still having difficulty lining these elements up. I'd like all the elements to be centred, vertically speaking, within the container rather than all being at the top.
https://drive.google.com/open?id=0B2B1U10Z2Bj4ZFdZQ2xxd1FydVk
Can you try adjusting the CSS to this:
@media (min-width:769px) {
.site-branding {
display: inline-block;
vertical-align: middle;
}
.site-logo {
float: left;
margin-right: 20px;
}
.nav-float-right .inside-header .main-navigation {
margin-top: 10px;
}
}Still having issues: https://drive.google.com/open?id=0B2B1U10Z2Bj4dHF3MTJkTzhOR1E
Nevermind. Created a new logo incorporating site title and it works now. http://www.citizens800.org
Awesome. Looks good!
