How to stop Sidebar from scrolling with a Listview

[Jim_A_4]

Hi all XDK experts,

I have a long list on a page with a sidebar added to the same page. When I showed the sidebar, scrolling the list will scroll the sidebar also. I am wondering how can I fix the sidebar so that when the list is scrolled, the sidebar does not move with the list? Thanks.

I have included a sample project to show the issue.

Jim.

[Chris_P_Intel]

Well, your mileage will vary based on the layout.

But if the list is inside a row/column construct, then setting the parent row Rest of Space attribute to true may be all you need to do.

Or, do that, and add a scrolling CSS rule to that parent row  ( overflow-y: auto )

Or, if the Rest of Space doesn't work for you (because your layout is too complex, or whatever) then manage it yourself. Put the overflow-y: auto; CSS on a parent of the listview (that is not also a parent of the sidebar) and manage its height (via CSS or JS, depending).

CSS Height can be a pain.  There is height, min-height, and max-height, and often those other two work better than the first one. And there is the vh coordinate, which works much better than %.    

Hope this helps,

Chris