Header Misaligned

Community Forums Forums General Discussion Header Misaligned

This topic is: resolved

This topic contains 25 replies, has 3 voices, and was last updated by  cccmedia 1 year, 8 months ago.

Viewing 15 posts - 1 through 15 (of 26 total)
  • Author
    Posts
  • #8541

    cccmedia
    Participant
    Post count: 23

    Hey guys, I’m having difficulty resolving a header issue in the Outreach Theme.  It’s something simple, I’m sure, but I’m not getting it.  The original header image is 1200 x 120 with the settings in the default settings in the functions.php file as 1060 x 120 and the CSS style sheet set to 100% for the width.

    The header was fine until I had removed the default site title text that shows left-aligned of the header.  After removing it, a space appeared to the right of the header.  I have tried everything I can think of to fix this and I’m apparently missing a step.

    I would appreciate any help!  Thanks in advance!

    Site is: http://www.theconvergencenc.com
    Brooks

    #8548

    Anita
    Blocked
    Post count: 7712

    I am using Firebug to see it.

    *** DELETED *** Previous message as the code didn’t copy correctly.

    It looks like you have two header images in there. When I remove this code – it appears correctly.

    This is the first code I see in the CSS – line 31

    #header {
    background: url(“http://theconvergencenc.com/wp-content/themes/outreach/images/header.png”) no-repeat scroll 0 0 transparent;
    }

    However, if you look at line 183, the #header code is there again. If you remove the one above, I believe this will resolve your issue.

    #8554

    cccmedia
    Participant
    Post count: 23

    Thanks for responding!  But, I removed the above mentioned text and nothing changed.  I cleared the cache, as well, just to be sure, but still no joy :/

    #8562

    cccmedia
    Participant
    Post count: 23

    Correction: Sorry I am using Firebug for the first time.  The live edit does reflect that it fixes the problem, but when I go into my style sheet and run the search for the same exact text I am seeing in firebug, it does not exist. I’m using Dreamweaver to edit the CSS.

     

    #8564

    Anita
    Blocked
    Post count: 7712

    Did you use the the Header feature at all under Appearance > Header?

    #8565

    cccmedia
    Participant
    Post count: 23

    I did initially until I realized that it wouldn’t properly re-size the logo, so I manually added the image atop the header.png file and re-uploaded it.

    #8567

    Anita
    Blocked
    Post count: 7712

    Go over to Appearance > header and REMOVE the image from there. I believe that’s where the problem lies.

    #8570

    cccmedia
    Participant
    Post count: 23

    Thank you for continuing to walk me through this, btw! But, now I have no image nor header at all.

    #8571

    Anita
    Blocked
    Post count: 7712

    But I thought you said you used Dreamweaver to insert the header image?

    #8572

    Anita
    Blocked
    Post count: 7712

    Do you see this code in your Style.css? If so – remove it. When I remove it from Firefox – the header shows up by way of another line of code. Delete that.

    #header {
    background: url(“”) no-repeat scroll 0 0 transparent;
    }

    #8573

    cccmedia
    Participant
    Post count: 23

    I initially tried to add the image via the header menu.  It would not crop properly, so I used the same header.png file provided in the images and files and just dropped my logo on top of it, and then uploaded it via http://FTP.  When I select remove the header image from the header menu, it just removes the file I had uploaded via FTP.

    The solution you originally suggested actually resolved the issue in the firebug console, but the code is nowhere to be find in the CSS.

    #8574

    Anita
    Blocked
    Post count: 7712

    I can’t for the life of me figure this out. But when I first looked at it – I changed the word Transparent to color code #000000. Add the image back in there and let me look again. Keep in mind that I think your image was wider than the header space also.

    #8575

    cccmedia
    Participant
    Post count: 23

    It’s back up for you, Ani!

    #8576

    Anita
    Blocked
    Post count: 7712

    Do you see this in your Style.css? If so, replace the URL you see there with the URL of your header image. Then remove the header from Appearance > Header.

    #header {
    background: url(“images/header.png”) repeat-y scroll center center #090909;
    margin: 0 auto;
    min-height: 120px;
    overflow: hidden;
    }

    #8577

    cccmedia
    Participant
    Post count: 23

    I found on 183 a very similar string of code but not exact. It didn’t read “center center” but did say #090909 center repeat-y.

    I added the URL, and then clicked remove header image from header menu and it went back to no header or image on site.

Viewing 15 posts - 1 through 15 (of 26 total)

The topic ‘Header Misaligned’ is closed to new replies.