Header Logo Align Center (not Left)

Community Forums Forums Design Tips and Tricks Header Logo Align Center (not Left)

This topic is: resolved

Tagged: ,

This topic contains 6 replies, has 3 voices, and was last updated by  Kim 1 year, 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #72568

    toddbublitz
    Member

    I’m using the Education Child Theme with Genesis. I’ve uploaded a logo.png file (Appearance –> Header). The logo is aligning to the left and I would like it to align Center (or right).

    http://www.atomshoots.com

    I have a “Header Right” Text widget in place.

    I’ve tried everything I can think of in the CSS and tried removing the Header Right widget.

    Any suggestions?

    Thanks.

    http://www.atomshoots.com
    #72587

    nutsandbolts
    Keymaster

    Remove your logo from Appearance > Header and add this to your stylesheet:

    #header {
    background: url(http://www.atomshoots.com/wp-content/uploads/2013/11/header-logo-840x1201.png) center no-repeat !important;
    }

    That will center it, though it overlaps the header right text a little.


    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #72590

    toddbublitz
    Member

    nutsandbolts,

    Thanks a million! It worked.
    ;-)

    #72591

    nutsandbolts
    Keymaster

    Awesome! If you don’t mind, please mark this topic as resolved so we’ll know you’ve been helped. You can always open a new topic later if you need to. :)


    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #79806

    Kim
    Participant

    Hey there! I think I am having a similar issue. I just upgraded WordPress & Genesis and now my header looks like it’s aligning left and it should be centered (I think) so it’s correctly aligned w/ the body of my site like it used to be.

    Would your fix help my issue as well?

    My site is: Delaware Bible College

    Thanks!

    #79871

    nutsandbolts
    Keymaster

    Hi Kim,

    Try this and see how it looks – I can’t tell if this is what you’re aiming for since I didn’t see the site prior to the upgrade.

    Remove the header image from Appearance > Header, then add this to your stylesheet:

    #header {
    background: url(http://delawarebiblecollege.com/wp-content/uploads/logo.png) center no-repeat !important;
    }

    Andrea Whitmer, Owner, Nuts and Bolts Media
    I provide dev and training services for web designers • Find me on Twitter and Google+

    #79988

    Kim
    Participant

    Thank you nutsandbolts. That did the trick to move the header, but then the header text (which is disabled in all locations) was showing up in front of the header. I tried the following instructions which I got from the Help Desk for another site and this fixed the issue. Someone else might need this too! =)

    Ok, what you’re experiencing is actually the result of a bug fix that your site was taking advantage of :)

    Since you are using CSS in your style.css file to add the header, I would recommend removing this from your functions.php file to fix the issue:

    /** Add support for custom header */
    add_theme_support( ‘genesis-custom-header’, array(
    ‘width’ => 1060,
    ‘height’ => 120
    ) );

    Then, under Genesis > Theme Settings, there will be a new settings box to select dynamic text or image logo. Select Image logo for the setting and click save.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.