Now streaming live

Fixed position doesn't work for my site


#1

Hi guys,

I hope everyone is doing well.
I need help to fix items.
I am working on my portfolio and I want to make the “user info div” on the left of my home page fix, so it always stays there when scrolling. I used fixed position, it works in designer mode but when I preview it, it doesn’t work.

I don’t know what I did wrong here, please help. Thank you in advance!!


Here is my public share link: http://d-second-portfolio.webflow.io/

https://preview.webflow.com/preview/d-second-portfolio?preview=ddc643d1198ca7b0f51c4e91b8765a3f

Here is an example which has the effect I am trying to achieve: https://webflow.com/website/google-font-gallery


#2

@kukumaluno1 can you please try the following?

  1. Remove the interaction from your body element

  2. Set the height of your project div to 100vh and set it to overflow: auto for the scroll to function:

  3. Set your filter menu to 70% width, fixed position and top right:

  4. Add 150px of top padding to your project div element or more:

Please note that you’ve added flex styles to the “body” class. I recommend removing these as it will cause unexpected behavior. Please try adding a div block to your canvas and giving it a class name of “body” and removing the flexbox styles, then deleting the div block: https://cl.ly/3t3I0b1Q3n24

I hope that this helps :bowing_man:


#3

Hi @Waldo
Thank you very much for helping me! I was wondering how to make the div as display block instead of flex item, I am so glad that you shared the solution!

I want to add the interaction back, but when I did so, everything doesn’t work again…:tired_face: what should I do?


#4

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