Reply To: BG Images on Mobile

Ok to fix this all you would need to do is move it up to the next responsive section (just move it up one). Right now it’s in the 480 width. Try moving it up to either 767 or you can add your own media query width if you want. For example, add this right before the 480 section –

@media only screen and (max-width: 640px) {
	.head-bg,
	.home-feature-1,
	.home-feature-2,
	.home-feature-3,
	.home-feature-4,
	.home-feature-5,
	.home-feature-6,
	.home-feature-7,
	.footer-widgets {
		background-attachment: scroll !important;
		-webkit-background-size: cover !important;
		-moz-background-size: cover !important;
		-o-background-size: cover !important;
		background-size: cover !important;
		background-repeat: no-repeat !important;
	}
}

You can change that number to whatever size you want.

Also, I noticed that your footer widgets section isn’t included on there so I added it to the code –

	.head-bg,
	.home-feature-1,
	.home-feature-2,
	.home-feature-3,
	.home-feature-4,
	.home-feature-5,
	.home-feature-6,
	.home-feature-7,
	.footer-widgets {
		background-attachment: scroll !important;
		-webkit-background-size: cover !important;
		-moz-background-size: cover !important;
		-o-background-size: cover !important;
		background-size: cover !important;
		background-repeat: no-repeat !important;
	}

This looks great so far 🙂 Keep up the good work! Be sure and add it to the showcase whenever you’re done – https://appfinite.com/showcase-your-site

Let me know once you make those adjustments and I’ll check on my phone to see how it looks.