Header Image Misalignment

[boogybrenMember Post count: 10]

Greetings,

If I use just the default header text for my header, it aligns up beautifully with the menus on the right . However when I upload my custom image of any size, it pushes the image higher than the menus to the right.

This is what I tried:

- Created an image 700px by 100px. WordPress wants to crop it to what appears to be the 960px by 100px aspect, which effectively makes the image bigger but poorer quality. See 700px100px

- Created an image 300px by 100px. WordPress wants to crop it to what appears to be the 960px by 100px aspect, which effectively makes the image bigger but much poorer quality. See 300px100px

- Created an image 960px by 100px. WordPress accepted it without asking me to crop it. But it sits above my menu. See 960px100px

- Changed the functions.php of my child theme from:

add_theme_support( 'genesis-custom-header', array( 'width' => 960, 'height' => 100 ) );

To…

add_theme_support( 'genesis-custom-header', array( 'width' => 300, 'height' => 100 ) );

…and used the 300px image again however the results resembled the 960px100px image.

I am just trying to get it to line up with the menu just like the default header text does. See default

How can I achieve this?

Best regards,
Brenden

• This topic was modified 4 months ago by  boogybren. Reason: cleaning up the post
• This topic was modified 4 months ago by  boogybren. Reason: forgot pertinent information

• This topic was modified 4 months ago by  boogybren. Reason: cleaning up the post
• This topic was modified 4 months ago by  boogybren. Reason: forgot pertinent information

[MaricarParticipant Post count: 6]

I’m also interested in finding the solution to this issue. So, I’m bumping it up.

[Bill MurrayParticipant Post count: 468]

Without a link to a publicly accessible site, it’s hard to get valuable feedback.

---

Twitter: @wpperform

[boogybrenMember Post count: 10]

What would seeing my site provide differently from the several screenshots I provided?

[braddaltonParticipant Post count: 2553]

Then we can inspect the CSS and HTML using Firebug.

What theme are you using?

I could test all your header images on my local installation with the exact same theme and work out a solution.

---

WordPress Developer & Consultant
Brad Dalton @ WP Sites – Click Here to Get Genesis Child Theme Tips Delivered.

[boogybrenMember Post count: 10]

Thanks Brad, that makes sense.

You can hit the site at http://66.147.232.234.

I am using Genesis with child theme Optimal from appfinite.com.

Let me know if you need anything further.

[braddaltonParticipant Post count: 2553]

Here’s what i see:

#title-area {
	float: left;
	overflow: hidden;
	padding: 20px 0;
	width: 250px;
}

.header-image #title-area,
.header-image #title,
.header-image #title a {
	display: block;
	float: left;
	height: 100px;
	overflow: hidden;
	padding: 0;
	text-indent: -9999px;
	width: 400px;
}

There’s an edit there that may be the problem but hard to say because this theme isn’t included in the Pro Plus package.

/* My Edit */
    border-top: 20px solid #000;
}

Try removing this code and uploading the header with 100px height.

---

WordPress Developer & Consultant
Brad Dalton @ WP Sites – Click Here to Get Genesis Child Theme Tips Delivered.

[boogybrenMember Post count: 10]

Brad, thank you for replying. I am sorry for the late response, I never received notification that you replied to my post.

I have commented out that entry however it didn’t change any of the results.

[braddaltonParticipant Post count: 2553]

Can’t see your header image.

You can use CSS to adjust the padding etc.

---

WordPress Developer & Consultant
Brad Dalton @ WP Sites – Click Here to Get Genesis Child Theme Tips Delivered.

[boogybrenMember Post count: 10]

Sorry, I removed the image. When I get back to my computer, I will upload them again so you can see.

[Author]

Posts