How do I remove the gap between my header and custom menu?

Community Forums Forums Design Tips and Tricks How do I remove the gap between my header and custom menu?

This topic is: not resolved

Tagged: , ,

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

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #11413

    Sunil
    Participant
    Post count: 85

    Hi,

    I’m using the agency theme. My site is http://adultacnetreatmentreviews.com.

    If you see that there is a gap between my header image and my custom menu.

    How do I remove this gap?

    Thank You.

    Regards,

    Sunil

    #11459

    Jon Bellah
    Participant
    Post count: 109

    So the simple fix to do what you’re looking for is:

    
    #header {
    display:none;
    }
    
    

    But I wanted to point out that there’s a much better way to implement a header than the way that you did. You’re using the <center> tag and calling your own header image, presumably with a genesis_before_header hook. But, Genesis comes with really nice, semantic structure built in. So the better way to implement your header would add this to the bottom of the “Image Header – Full Width” section of style.css.

    
    .header-full-width #title {
    background:url(images/header.jpg) no-repeat;
    }
    
    

    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    #11463

    Sunil
    Participant
    Post count: 85

    Hi Jon,

    Thanks for your response. Ok. Before I implement what you highlighted, where exactly in the style.css file, do I place the following code?

    #header {
    display:none;
    }

    Because when I open the style.css file, I see many header option codes there. Also where do I place these following codes too?

    .header-full-width #title {
    background:url(images/header.jpg) no-repeat;
    }

    In this case, the [header.jpg] is to be replaced by my original image name right?

    I just switched from eleven40 theme today to the agency theme. It was difficult to customize the header for that theme. But I liked the footer of that theme. I had a nightmare when I tried to edit the php file. All I did was added an extra } code and the whole thing went blank! But thankfully Brad Dalton from the helpdesk helped resolved my problem.

    #11464

    Sunil
    Participant
    Post count: 85

    Sorry, something went wrong with my message. The codes not displaying well here.

    #11465

    Jon Bellah
    Participant
    Post count: 109

    Place the #header code just before the line that reads:

    /* Navigation Constants
    ------------------------------------------------------------ */
    

    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    #11466

    Sunil
    Participant
    Post count: 85

    Hey Jon! I managed to remove the gap! Thanks! You seem to be well-versed in css!

    So for the 2nd code you showed me, before placing it in the style sheet, do I have to remove the codes I placed in the genesis header hook first?

    #11476

    Jon Bellah
    Participant
    Post count: 109

    Yes, you should remove that when you place the other code in your stylesheet. Hope that helps!


    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    #11480

    Sunil
    Participant
    Post count: 85

    Hi Jon,

    Sorry. I did not work. The banner did not appear. So I’m recalling the banner through the genesis hook method again. :(

    #11481

    Sunil
    Participant
    Post count: 85

    *It did not work.

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

You must be logged in to reply to this topic.