Fixed Position In a Component

[Syeds]

I have a sidebar filter that is a component with multiple states but I would like that filter fixed as the page scrolls. I have fixed position groups out of a component but I do not know how to achieve this from within a component. Is it even possible? and How? Thanks.

[Spas K.]

Hey there! Could you post some screenshot of how it's set up and what you need to be fixed position? Is the whole sidebar going to be fixed? You can't make parts of a component fixed, but you can do it for the whole component.

[Syeds]

No, entire sibar does not need to be. Only the sidebar content which scrolling vertically needs to be fixed. 

[Spas K.]

So you want to be able to scroll that list of states independently of the rest? You can put the states inside the white box into a scroll group, so when you hover over it with the cursor and scroll, only the states will scroll vertically.

Made you a quick example. Here's the prototype, and here's the .xd file.

Scrollbar doesn't move, but that's beyond Xd's capabilities 🙂

[Syeds]

@Spas K. Thanks for doing this. I actally achieved this already. Thanks for your previous guidance wen I was in my earlty stangeg of learnign Abode XD. I actually am looking if it is possible to fix the position from"Reset Filters >" to the end of the tag clound "Private schools" The verticle scroll I am talking about is the page scroll.

[Spas K. · Accepted solution]

Oh, okay, I see. I just now noticed that your sidebar is a part of a larger component, along with the elements on the left (image, title, cards and so on). You can't fix elements within a component independently. If you want to fix the sidebar only, you'll have to take it outside of the "The NAEP Blog" component, which might require you to change how the whole thing works. Anything that's part of a component moves together, so you can't partially fix elements from it.

[Syeds]

Yes, you are correct and that what I did. I had to change up my component structure a bit but I got what I intended. I appreciate you lookingi into it. Take care.