Background Image distorted on mobile

Hi,

My website www.myhausbrighton.co.uk has a background image inserted via the customise menu. My issue is that when viewed on a mobile the background image is heavily distorted, please advise.

Many Thanks

Hello,

First thanks for using our Sydney Pro theme!

Sorry but we couldn’t reproduce the mentioned issue. Here’s a screenshot from what I am seeing:

If you mean the both sides of image being “cut”. That’s the expected behavior. If that’s not the case, please send a screenshot for us, so we can see what’s happening.

Kind Regards,

Rodrigo.

aThemes Support

Hi Rodrigo,

Thanks for getting back to me so quickly! For some reason the issue is not replicated on a computer in mobile view, it is only happening on an actual mobile, hopefully the attached image will help.
Many Thanks

Hello,

Thanks for the screenshot!

That’s because you have a background-attachment: fixed; in the body tag, and unfortunately this CSS property is not supported on Safari yet.

To fix, please try adding the given custom CSS code below at Appearance > Customize > Additional CSS:

@media only screen and (max-width: 1024px) {
    body.e--ua-safari {
		background-position: top center !important;
		background-size: 2000px !important;
		background-attachment: scroll !important;
	}	
}

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.

aThemes Support