Trouble with Fixed background assigned to Body class

Design help General
1

So its there, I dont want it to scroll. I really want it static. I used to click on “FIXED” on the image dialog box. Suddenly… its just broke. My image scrolls no matter what I do by clicking it FIXED or NOT. This just all of a sudden happned. Any idea?

Here is my public share link: LINK
(how to access public share link)

2

btw… I am aware that fixed images dont work in safari, dont know if its been updated yet. But I am having this issue using my laptop running the latest Chrome. I cant get the background image to stay put. It was working fine yesterday and last night until this afternoon.

3

How about a read-only link to your site?

Thanks,
~B.

4

https://preview.webflow.com/preview/pixelcell-186afcb91866b17ba7fb9ac9b4633?preview=ac6a6e9591d069aeb40d090e37c7fe87

5

go to the “WEB Landing” page, I duplicated the section a few times so you can see how the background image moves. Its odd, dont know what i did… because it was working fine this morning.

6

Hi @cgmindd, I have two suggestions. First, remove the fixed image from the body, there is generally poor support for that and unpredictable results can happen when assigning a fixed image to the Body.

Instead, remove the “web landing body” class that was assigned to the body, and create a new div under the body element. Assign the “web landing body” class to that div.

On the “web landing body” class, give that a position fixed, with a full cover and a z-index of -1 (so the div is under all other elements on the page).

Now you have fixed background that should work on all devices:

Take a peek here:

Create new Div:

2578×1430 1.41 MB

Update styling on “web landing body” class with fixed positioning:

472×1256 56.7 KB

I hope this helps!

3 Likes
7

Awesome Dave! That fixed the scrolling. You are right about it being unpredictable, it was working fine for a very long time.

8

Another quick question Dave, some time i cntrl C and V stuff like the Navbar, or other divboxes. The edits to those clones are across the board, how would you go about and unlinking the clone from the rest of the pack?

9

Hi @cgmindd, thanks for getting back to me :slight_smile: Well, if I understand correctly, you are asking how to unlink a Symbol (the elements in Green) from the rest of the symbols?

If so, take a peek here: Symbols | Webflow University. Read the part on unlinking a symbol.

“To unlink a Symbol, right click on an element and select “Unlink from Symbol” or hit CMD+SHIFT+A (CTRL+SHIFT+A on Windows) while the Symbol is selected.”

I hope this helps!

10

Thxs Dave … that did the trick.

1 Like