Center Logo and Navigation in OUTREACH PRO

[PaulS]

I need some help centering the logo and navigation on my Outreach Pro site. I have tried several of the suggested solutions in the forum to no avail. Does anyone know how to do this?

http://sandbox.targetmediapartners.com

[PyramidWeb]

Hi Paul,
To center the nav, edit your "style.css" and change

.genesis-nav-menu {
    clear: both;
    font-size: 1.4rem;
    line-height: 1.4;
    width: 100%;
}

to

.genesis-nav-menu {
    clear: both;
    font-size: 1.4rem;
    line-height: 1.4;
    text-align: center;
    width: 100%;
}

From my opinion, the logo as it is now cannot be easily centered since the logo image is inserted such that the default css in "style.css" is overwritten by

.site-title a {
    background: rgba(0, 0, 0, 0) url("http://sandbox.targetmediapartners.com/wp-content/uploads/2016/08/TMPi-email-logo.png") no-repeat scroll 0 0;
}

First, check these websites:
https://wordpress.org/support/topic/center-site-title-background-image-logo/

How To Fix Outreach Theme Header Problem & Add Different Sized Images

If this doesn't help, I'd suggest to remove the logo image within the WP dashboard and add it manually (just copy the above css to your style.css and change "0 0" to "center center").

[PaulS]

Thanks, Pyramid Web – the nav is centered with your code. The link to the wp.org site helped too – thx!

All, here is the code to center the logo in Outreach Pro below.

Just add to "additional CSS":

.site-title a {
background-position: center center !important;
}

[tfmwa]

Thank you guys for sharing these solutions! This was a lot harder to figure out than it should be in my opinion.

What worked for me is adding a logo using the Customizer as normal. And then adding the custom css @PaulS mentioned last to another custom css rule I am using to increase the height of the header area, because I'm using a bigger logo:

.header-image .site-title > a {
min-height: 140px !important;
background-position: center center !important; }

[Author]

Posts