Lock left hand side bar when scrolling

Hi webflow friends :slight_smile:

I’m making heavy use of flexbox for my website. You can see an example page below:

https://talmora-portals.webflow.io/partner/manage-team

What I’m struggling to figure out how to do given my current layout is how to lock the left navigation bar so that all the links stay in place whilst the main content on the right hand side is free to scroll.

Is there anyone who might be able to advise me?

Hoping that there’s an obvious/easy fix I’m missing here!

Many thanks in advance


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Just wondering if anyone could offer some assistance on this one?

Thanks

Hello @Darius_Safavi,

You need position fixed, I did a quick video about how to fix your current layout. Loom | Free Screen & Video Recording Software | Loom. I hope it helps. Let me know if you have more questions.

great thanks

as i’m using flexbox, position “fixed” was having the right section encroach on the left hand side too much

i’ve just tried adjusting the height of the left hand bar to 100vh and that seems to have fixed my issue for now…not sure if makes some sense?

thanks

Yes, If you have it at 100vh then you can use position sticky relative to the body.