Mobile header problem

Hi there,

Not quite sure if I understand.

What do you mean that it's pushed out?

Sometimes it's much easier to have a specific background image for mobile:

@media (max-width: 768px) {
    .home .page-hero {
        background-image: linear-gradient(0deg, rgba(0,0,0,0.12),rgba(0,0,0,0.12)), url(https://MOBILE-BACKGROUND-IMAGE-HERE);
    }
}

By “pushed out” I've meant that without any content a header image is okey, but when I publish anything the image is moving.

As you can see here:
https://imgur.com/a/fWZBOaF

Just checked on my phone and don't think I'm seeing what you are seeing:
https://www.screencast.com/t/cseicZ5cJkHj

Have you tried clear and disable the caching plugin?
https://www.screencast.com/t/cPh1dY1vcmm

Yes I did, I added even more content now, and the header image has moved again.

I would like to have it as a static image.

without that code above it is looking like I want.
https://imgur.com/a/kfeD4Qy

Sorry I'm a little confused.

So you want your original code only apply to desktop?

If so you can wrap it in the media query:
https://docs.generatepress.com/article/responsive-display/

Yes, but I cannot find the way how to do it.

Find a way to do what?

If you want to use a fixed background image, shouldn't the parallax be turned off?

No, I did not find a way.

I tried to use this code:

@media (max-width:768px) {
.fake-para {
background-position: center top !important;
background-size: contain;
}}

and then played with padding for a mobile version, but a problem was that the image wasn't always same sized. It didn't look good.

If you want to use a fixed background image, shouldn’t the parallax be turned off?

Parallax feature is turned OFF in elements.

Sorry I'm really confused about what the problem is.

This is what I see on mobile and looks like everything is executed correctly as per your code:
https://www.screencast.com/t/xfhrLl5YdW

I think I have just solved the problem now, it was kinda confusing because as we were writing I was still trying to play with code ...

thank you anyway :)

No problem :)