Fixing background image on window resize

Design help General
1

Hello guys,

This has been killing me for the last 2-3 hours. I’m about to cry :frowning:

In my Hero background (see links below!) there are two shapes and a milk truck. I want the GREEN shape to STICK when resizing the window. The yellow shape and the truck work perfectly… but the green shape on the left keeps moving when I resize the window… I just want it to stay where it’s put!

Please can someone help put me out of my misery?

You will see in the video below that I’ve tried changing to custom from cover and also fixed… didn’t work.

I’m guessing it’s something to do with min height/min width?

Or positioning? It’s absolute I thought it was supposed to just stay where it’s put :frowning:

Thanks guys!

Here is a video: https://streamable.com/mdcrbj

Here is my site Read-Only: https://preview.webflow.com/preview/be-crateful?utm_medium=preview_link&utm_source=designer&utm_content=be-crateful&preview=389f5fbf7201fc733aa9a66ab564e16e&mode=preview

2

I remove the background image and placed an image holder (with the image) inside the Div. I then Fixed it with some negative numbers. It does not move when resizing.

image
image861×579 113 KB

3

Thank you for trying to help but…

No.

That will follow the user when he scrolls down…

Can anyone else help? :frowning:

4

Anyone?

Really hoping someone can put me out of my misery how to stop the background from shifting when resizing window.

5

Hi guys,

After a day - I finally resolved this. I’m not sure how… I basically set the div to 50VW… not sure how that fixed it but if anyone can advise me so I can LEARN why it wasn’t working that would be super!

Thanks anyway,

J

6

Hey man,

I really feal you… I am in the same situation:

image
image1348×689 85.6 KB

Have you found out how to fix it? I want that this grey triancle stays where it is but it keeps moving up and down when I resize the window.

It’s been two years but maybe you are still active…

Hopfully - Jakob