Background Image Shows Well On Android, Wrong On IPhone - Question | JoomShaper
Back to the questions

Background Image Shows Well On Android, Wrong On IPhone

H

H

SP Page Builder 3 years ago

I have a website (www.ijscomanvenlo.nl) that has a hero image in its first row (The ice cream cones). It is implemented as the background image of the row.

On the Android phone of my wife, the image is scaled to the width of the screen and looks like I want. But on my iPhone 8, the image is not scaled down : https://prnt.sc/rLS1m1hHPmnI

Am I doing something wrong? Or is this a bug?

Hubert

0
3 Answers
Order by
Oldest Newest Votes
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #88858

In your case add following Custom CSS 

.sp-page-builder .page-content section.sppb-section {
  background-attachment: scroll !important; }

you can use it inside that Page in Custom CSS or in general in Template Options > Custom Code > Custoom CSS.

2nd idea is to create separate Row/section for Mobile only, with different settings and smaller img.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #88856

Hoi Hubert

explanation is very simple, and this same problem have webmasters using all possible CMS and Page Builders.

background-cover-fixed.png

Safari browser from iPhones 1-12 still DO NOT understand what to do with background-size: cover and background-attachmend: fixed and display what you have seen. Yes, Apple Bug! or Feature as they say.

Yes, there is a fix for that.

0
H
H
Accepted Answer
3 years ago #88869

Clear. Thnx.

0