Problem with fixed background image

Hi all, I was wondering if I am using background image wrong. I notice that if I set my hero area to be background fixed, it cuts off the heads of the ladies I am using in the background. Even if I set the focus point to be top, the image is rendered as if it is way higher than it actually is.

Am I doing something wrong? How do I set that hero to be fixed while having the top of their heads be at the very top edge of my hero div? Right now if I set it to fixed it just won’t do that. If I adjust the BG image using the arrows so that their heads are at the top, you see a section of blank background as you scroll :frowning:

Here is my public share link: LINK

Did you fix the issue?

You can set up a different position for your background image but you’ll get a weird background image.

No, the issue is still not fixed. Setting an image to BG position of FIXED seems to have the BG image ignore the position of the DIV it is in, and act as if it is aligned to the top of the page, rather than its DIV.

A fixed image will always fix its position to the page height.

That’s pretty annoying :frowning: Is there any other way to get the image to exhibit the behavior I desire? I want it to treat the the DIV it is in as where it begins its position fixed, rather than the page.

Maybe you can do this:


I did try that. But when you do that there is a big ugly empty gray area above the hero as you scroll. You can see it in both my original gif (I even try to point it out by waving my mouse cursor a bit) and the one you posted. Thanks for trying to help though.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.