Remove White Space About Header

[blogelina]

Hello!

Can anyone tell me how to make the white space above my header area smaller on the Magazine Pro theme?

Thank you so much!

http://blogelina.com/

[Tonya]

Hello,

Right now your header height is being set by 2 factors:

1) Your logo is 434px wide x 174px high.

2) On line 195 of your style.css file, the min-height is set to 177px;

.header-image .site-title a {
	background-position: center !important;
	background-size: contain !important;
	float: left;
	display: block;
	min-height: 177px;  /* See right here is set to 177px */
	text-indent: -9999px;
	width: 100%;
}

Is the white space relative to the nav menu (and you want to keep your logo large) or the header in general?

1) If the former, then start by reducing the white space within your logo. Then adjust the min-height to match the logo's height.

2) If the latter, then simply reduce min-height, as your logo will scale down.

Cheers,
Tonya

---

Software & Electrical Engineer and Programming Teacher · I’m on a mission to help developers be more awesome.
Find Me: KnowTheCode.io | @hellofromTonya | Profitable WordPress Developer Bootcamp

[blogelina]

Thanks so much! So I reduced the min-height and it looks great on the home page - but too small on my blog page. Is there any way to reduce it only on the home page?

Really appreciate your help!

[Tonya]

Absolutely. Remove the change you just did and then just below the closing }, add this:

body.home .header-image .site-title a {
	min-height: 170px;
}

And set the min-height to what you want it to be.

If you are using Jetpack, I highly recommend using the Custom CSS add-on and making changes to your site in that file instead of altering your theme's style.css file.

Cheers,
Tonya

---

Software & Electrical Engineer and Programming Teacher · I’m on a mission to help developers be more awesome.
Find Me: KnowTheCode.io | @hellofromTonya | Profitable WordPress Developer Bootcamp

[blogelina]

You are AMAZING! Thank you so much!

[Tonya]

You are very welcome! Always glad to help out.

Enjoy the rest of your day,
Tonya

---

Software & Electrical Engineer and Programming Teacher · I’m on a mission to help developers be more awesome.
Find Me: KnowTheCode.io | @hellofromTonya | Profitable WordPress Developer Bootcamp

[Author]

Posts