Moving Header Text Down/Image Expansion

Hello,

In your theme’s style.css, locate the following code and remove the margin-top line:

.content {
	width: 68.7%;
	float: left;
	margin-top: -120px;
}

Be aware though that the next time your theme pushes out an update, any custom changes you made will be lost. For that reason, it’s better to create a child theme and make your changes in the child.

Hope that helps.

Thx.

Thanks for the quick response!

But, I removed both the “margin-top: -120px” line and nothing happened. Removed the everything in the entire brackets, still no change ??

Thanks,

Greg.

hi greg, so basically you want to move white box contains single post and the header text (site title?) so your image would show at its full size?

remove the margin-top: -120px will make the container of contents after header image to have 0 margin but it doesn’t move the white box because the height of your header image is set to 350px, so the box will still there. you just have to make your image more higher so it will force the container to move down.
i’m new to css and wordpress but let’s try this,

Locate header image section in your css,

/* Header image --------------------------------------- */

.header-image { max-height: 350px; }

change it to;

/* Header image --------------------------------------- */
.header-image { height: 700px; }

*Note change the pixel as your image real height.
if your image automatically cropped when added from customizer to 350px of height then your image would have 700px of height but the image would distorted..
let me know if it doesn’t help.

sincerely,
jjerro

Yes, you have the idea. I just want the text and the white box below the header picture to be pushed down to reveal the picture in it’s entirety (instead of being somewhat cut off on the bottom).

Unfortunately, after adding your code suggestion, there was still no change… ??

hi greg, i see your code you have changed;

/* Header image --------------------------------------- */

.header-image { max-height: 600px; }

there are different between max-height and height in css, i don’t know how or why since i am new too.
and your code still using max-height property.. what i am suggest is using only height. change max-height to height.

regards,
jjerro

jjero,
max-height means the element will grow no larger than that size, but it could be smaller. height means the element will be exactly that size.

Greg,
I think you’ve fixed the problem you were having? Although I’m getting a 404 error when I go to your site so I’m not sure. And isn’t distilling moonshine illegal? ??

now i get it… thank you Donna.

It’s been pushed down and looks much better. Thank you all!!

you are welcome.