Streaming live at 10am (PST)

Sticky Position and Fixed background image issues


#1

Issues with sticky position and fixed backgrounds. (My site links are below.)

Fixed background image: this worked at one point, but suddenly stopped. I haven’t been able to find a cause. It seems to be a site-wide issue, and not related to a single page or class. UPDATE: I just realized that this is getting overridden by html.w-mod-touch *. I can work on a work around with that if there isn’t another fix.

Sticky position:
I’m want to create specifically a sticky social sharing bar that sticks to the top of the screen on scroll. However, I have other uses planned as well. The element is in the Resources template right underneath the main post image. The custom html is in the same div as the social share bar. I’ve combed through the forum and tried to troubleshoot on my own. I’m using the same code from Webflow’s site here: https://preview.webflow.com/preview/help-site?preview=74bf04bc2857da904aa0a2d5fcfedd4d

Both issues are not browser related because the same elements are working in other sites in my browser. (Chrome, but I’ve also tested in Firefox.)


Here is my site Read-Only: https://preview.webflow.com/preview/katieschwarzdesign?preview=6dc63f15ca0089d5d31fcf0d33f3066d

Live Webflow site: http://katieschwarzdesign.webflow.io/


#2

Update. I did a test, and the issue is that it is inside a parent div. So, it’s still not working, but I have at least narrowed it down.


#3

Another update. I finally figured it out. I moved it out of the parent div that required a relative position for a pin button, and it working now. Yay! The three remaining parent elements are not positioned if anyone stumbles on this conversation with myself in doing their own troubleshooting. For reference, the structure is body --> div with block display --> flexbox div --> div with block display.