I'm using a grid system with 3 columns in my SPA. The left and right list contain components that occupy 100 of the viewport height. The middle column contains a long list and would like to add a scrollbar just to the middle component. I've tried to wraw the middle component with several different scrollbar components but nothing works. I end up always with a main page scroll which leaves me only with the list component when scroll further down and left and right component are remaining remain to the top of the page.
You can apply it by placing the overflow-y:scroll in the id growth inside the style tag. Notice the scroll bar on the right side of the div .
To make a horizontally scrollable div we have to write overflow-x: scroll; with white-space: nowrap; ( in the case of text content ) and it will make a horizontally scrollable div.
Found the solution, need to set fixed height to left and right component and overflow:scroll to middle component.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With