[Support request] background-image of container fixed

[Petri]

Hello,

In an element I have a container with a background-image and some content on it (content should scroll over image).
I have set the background-attachment to fixed.
I know that this causes a problem on ipad/iphone.

I looked up earlier topics about this and wanted to solve this by adding your css touch-screen solution for this:

@media(pointer: coarse) {
.gb-container-ebe0908d,
.gb-container-ebe0908d:before {
background-attachment: initial !important;
}
}
However, I see (inspector) when testing on smaller screen sizes on my desktop that ‘fixed’ is already turned off by some other css:
@media (max-width: 767px)
.gb-container-ebe0908d {
background-attachment: initial;
}}
I didn’t add this code or set it up in the container Background settings like this (as far as I know ;-)).
This means that always on smaller sizes than 767px (not only touch-screen) fixed is turned off?
If so is there a way to overrule this?

Thanks.

[Ying]

This means that always on smaller sizes than 767px (not only touch-screen) fixed is turned off?
If so is there a way to overrule this?

That is correct, the CSS is added by GB to ensure the issue would not happen.

If you want to override it, you can add this:

@media (max-width: 767px) {
.gb-container-ebe0908d:before, .gb-container-ebe0908d {
    background-attachment: fixed;
}
}

[Petri]

Thank you Ying,
If I do so does this mean that background-attachment ‘fixed’ will work on other mobile devices than iPad and iPhone?
Or doesn’t this work on mobile devices anyhow?

Thanks again.

[Ying]

If I do so does this mean that background-attachment ‘fixed’ will work on other mobile devices than iPad and iPhone?

I’m not sure. The CSS just to cancel the CSS added by GB, so your CSS can work.

But weather it’s going to work on other mobile devices than iPad and iPhone, it depends on the browser support of your media query @media(pointer: coarse). I haven’t used this media query before, hard to tell.

[Author]

Posts