How do I make my Home page photo appear full screen on mobile phones

Site URL: https://www.jerrybezdikian.com

My home page photo appears full screen on my Desktop computer and my iPad, but on my iPhone, there's a white space that appears beneath the photo.

I was informed by Squarespace customer care that filling the entire screen with a photo on the home page on an iPhone isn't a feature with the Carson template. He suggested that it might be possible with custom coding, and that I post the question here.

I know nothing about coding, and would be most grateful for any assistance or guidance. Thank you in advance.

8 hours ago, JerryBez said:

Site URL: https://www.jerrybezdikian.com

My home page photo appears full screen on my Desktop computer and my iPad, but on my iPhone, there's a white space that appears beneath the photo.

I was informed by Squarespace customer care that filling the entire screen with a photo on the home page on an iPhone isn't a feature with the Carson template. He suggested that it might be possible with custom coding, and that I post the question here.

I know nothing about coding, and would be most grateful for any assistance or guidance. Thank you in advance.

Try the following configuration in Desin > Custom Css

@media only screen and (max-width: 768px) {
	.homepage [data-slide-id="610c29e83f1f825f0dce7cfa"] img {
		height: 100vh;
		width: auto;
		position: relative;
		transform: translateX(-50%);
		left: 50%;
	}
}

53 minutes ago, HoaLT said:

Try the following configuration in Desin > Custom Css

@media only screen and (max-width: 768px) {
	.homepage [data-slide-id="610c29e83f1f825f0dce7cfa"] img {
		height: 100vh;
		width: auto;
		position: relative;
		transform: translateX(-50%);
		left: 50%;
	}
}

Thank you HoaLT for the quick reply and the code. That was very kind of you. Unfortunately I have zero knowledge of coding or how to apply this, and will have to figure it out - and hopefully not break anything in the process. 😊

1 hour ago, JerryBez said:

 

For the way to add Css, you could get a reference from this link

https://support.squarespace.com/hc/en-us/articles/206545567-Using-the-CSS-Editor

Or follow the steps on my Gif

12 hours ago, HoaLT said:

For the way to add Css, you could get a reference from this link

https://support.squarespace.com/hc/en-us/articles/206545567-Using-the-CSS-Editor

Or follow the steps on my Gif

Hi HoaLT, I don't think that my earlier reply was posted.

I just wanted to say how very much I appreciate all of your time and effort on my behalf. Your instructions from yesterday were easy to follow. Unfortunately, when I went to Design>Custom CSS, I saw the following notice:

"Note: Custom CSS does not apply to Cover Pages."

I appears that a modification isn't possible for my Home page. I'll just have to live with the white space beneath my photo on mobile phones.

Thank you again for trying to help me.

3 hours ago, JerryBez said:

Hi HoaLT, I don't think that my earlier reply was posted.

I just wanted to say how very much I appreciate all of your time and effort on my behalf. Your instructions from yesterday were easy to follow. Unfortunately, when I went to Design>Custom CSS, I saw the following notice:

"Note: Custom CSS does not apply to Cover Pages."

I appears that a modification isn't possible for my Home page. I'll just have to live with the white space beneath my photo on mobile phones.

Thank you again for trying to help me.

You can get some reference in this post with your cover pages

18 hours ago, HoaLT said:

You can get some reference in this post with your cover pages

 

Hi HoaLT. Wonderful news! The code you provided worked!

Apparently because of my being such a Squarespace novice and my ignorance, I didn't know that my home page photo was a 'gallery image', and not a 'cover image'. Someone from Squarespace customer care examined my site and pointed that out to me. So I followed your initial instructions and added the code... and it worked! No more white space beneath my Home page photo!

You are a GENIUS! But what matters even more than being a genius is being kind-hearted and having a willingness to come to the aid of others. I'm 68 years old, and having had no income for almost two years due to Covid restrictions, I'm doing everything that I can to get my career as an independent photographer back on track. Which is why I created a Squarespace website, and I just want everything to look as polished and professional as possible.

I can not possibly thank you enough. I wish you blessings and hope that others you encounter in life will be as kind to you as you have been to me. Thank you again and again.