I am using pootle pagebuilder for my website Skyblueyoga.com I have added an image using pagebuilder in a row as a background it looks fine on a desktop and To some extent an iPad but on the iPhone the image does not resize without leaving either a huge empty space between it and the text or as is at the moment cuts half the image out. I have tried parallax, cover, 100% and every option available I have even resized the image multiple times but this still does not help and ultimately reduces resolution on desktop website. Can you please advise where I am going wrong
Background images are set to cover by default – this is so if the screen is smaller then text won’t drop off the bottom of the image – so the background image will also cover the space needed for the text as the text wraps. However what this does mean is that the image will look like it’s being cut off in the background. There’s no real way to solve this (without custom developement and swapping out the image for mobile) – its just something to consider when choosing your image.
It’s quite hard to explain and get your head around but let me know if that makes some sense,