Chris Arvan – Artist | Composer

Thank you for writing in!

Upon checking on iPhone 6 with iOS 8.1, I’m unable to replicate the issue (see: http://prntscr.com/51jzsa). Would you mind confirming again? If you can provide us a screenshot of how it’s appearing in your iPhone 6, we’ll be able to provide you a tailored answer.

Thanks!

I want it to actually show more of the whole picture. It was doing that before on my older phone.

maybe there is a setting or some extra code I can put in to control that.

Thanks!

Thanks for writing in,

Upon checking on your site, I can see now the background is re-sizing properly on mobile,

http://i.imgur.com/WGJMvAV.png

I have also notice that you’ve added a height for each band when screen size is in 480 pixel

It looks like your issue has been sorted,

Can you please confirm?

Thank you

Can you please try replacing your CSS from this

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
.content-band-1 {
    height: 300px;
}
.content-band-2 {
    height: 250px;
}

.content-band-3 {
    height: 300px;
}

.content-band-4 {
    height: 400px;
}

.content-band-5 {
    height: 500px;
}

to this

@media only screen and (min-width : 320px) and (max-width : 480px) {
	/* Styles */
	.content-band-1 {
		height: 300px;
	}
	.content-band-2 {
		height: 250px;
	}
	
	.content-band-3 {
		height: 300px;
	}
	
	.content-band-4 {
		height: 400px;
	}
	
	.content-band-5 {
		height: 500px;
	}
	.x-content-band.bg-image.parallax, .x-content-band.bg-pattern.parallax {
		-webkit-background-size: cover;
		background-size: cover;
	}
}

Let me know how it works

just tried replacing the css code. Still looks the same on mobile.

Due to different sizes of your background, there is no easy way. Example, the fix works on second content band. But not on first.

Replace this css :

	.x-content-band.bg-image.parallax, .x-content-band.bg-pattern.parallax {
		-webkit-background-size: cover;
		background-size: cover;
	}

With this css,

.x-content-band.bg-image.parallax, .x-content-band.bg-pattern.parallax {
-webkit-background-size: 100% auto !important;
background-size: 100% auto !important;
}
/* Need to set background position for first content band, and 
duplicate this area if you wish to control other content band too (with your own positioning) */
div#x-content-band-1.x-content-band.vc.content-band-1.bg-image.parallax.man {
background-position-y: 20% !important;
}

Cheers!