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

[Sunil]

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

[Jon Bellah]

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

[Sunil]

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.

[Sunil]

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

[Jon Bellah]

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

[Sunil]

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?

[Jon Bellah]

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

[Sunil]

Hi Jon,

Sorry. I did not work. The banner did not appear. So I'm recalling the banner through the genesis hook method again. 🙁

[Sunil]

*It did not work.

[Author]

Posts