- Posts
Hi! My website has multiple background images, especially in my SHOP THE FIT page. These background images appear just as desired on a laptop but on mobile they are extremely zoomed-in (i can’t even tell they are actual images). When seen on the Boldgrid CSS editor preview (mobile view) it looks fine but that is not how it appears on a mobile ( When I try viewing the page on my phone). I have tried multiple media tags, etc., nothing seems to work. I would really like some assistance with this.
( i use the basic version of Crio, having such a bad experience working with it, I would love to change themes but it is too late because my content just gets messed up when I try to switch themes)
Cheers
Hi DG-
The issue you’re seeing is because of the way that iPhones specifically (it looks great on my Android phone) handle backgrounds that have both the Cover size and the Fixed position.
One way you might consider resolving this is to change your backgrounds to Parallax. This would introduce a little more movement to the page, but it would look consistent across devices.
Another way you could handle this so that you can keep the fixed appearance but also work with iPhones well is to add a Custom CSS rule similar to this:
@media screen and (max-width: 991px) { div.background-fixed {background-attachment: scroll !important; } }
- The topic ‘Background Images too large on mobile’ is closed to new replies.
