Align background image to the top of an image rather than the bottom.

Hello! Is there a way to force the background image to align to the top of the image in full-bleed mode rather than the bottom? The focal point tool allows me to move the image horizontally but not vertically. Any time I use an image with people the faces get cut off with the default alignment. Thank you so much for your help!

I'm having this same issue! 

The background of the first section will always extend to fill the space behind the navigation bar so that if the navigation is transparent then there will be background behind it as well. It's generally best practice with background images to make sure there is a reasonable amount of negative space around any subject as background images always crop to fit the space behind the content. Do you have a version of the banner image that has more head-room? 

Ahh. That makes sense. Thanks, Ziggy. Using that I found a workaround by adding a section above the image, shrinking it as small as possible and color matching to the top navigation. It makes the top most section a little bigger, which is not ideal, but not a dealbreaker. I tried using this custom CSS to shrink it further but couldn't get it to work:

[data-section-id="abcxyz"] {
	min-height: unset !important;
	height: 50px !important;
}

Thanks again for your insight. 

You are a genius. That totally worked. Thank you! For anyone else with this issue, get the Squarespace ID Finder extension for your browser to easily get the data-section-id. Also, it worked great when I added it to Custom CSS under Design, but did not work when I added it to Pages --> Page Settings --> Advanced. 

Thanks again!

9 hours ago, CCMH said:

You are a genius. That totally worked.

Fantastic!

9 hours ago, CCMH said:

Also, it worked great when I added it to Custom CSS under Design, but did not work when I added it to Pages --> Page Settings --> Advanced. 

The code injection areas require HTML not CSS, though you can specify that the HTML you are adding is CSS with these opening and closing tags <style></style>