Awaiting an answer Templates

Travelin Template - wrong scaling of background on iOS

Asked by Wiktor 3 years ago Last activity 3 years ago

Hello.
There seems to be a problem with background image scaling in my template, but as I noticed, this only happens on macbook and iPhone. Works fine on windows and Android.
I think it also works fine for backgrounds which scroll, but overscales for images, that are fixed.
Site url temp.dworzno.pl

3 replies

Mehtaz Afsana Borsha Staff

Hi

Thanks for contacting us. Could you please give me a screenshot of your issue?

-Regards.

Pavel
3 years ago · edited

Hi. IOS (Safari) does not support fixed background css property. So this can be fixed only through CSS. Add your own class to all sections in which you use a fixed background. For example mobile-bg-scroll .

And use following CSS code.

@media (max-width: 991px) {
    .mobile-bg-scroll {
        background-attachment: scroll !important;
    }
}

Or you can use specific media queries for IOS only instead of @media (max-width: 991px) {...}

https://gist.github.com/michaelaguiar/3795392

Log in to reply.