I need to fix the position of 1st component on top & 2nd component at the bottom of page.Both shouldn't be scrollable (As i want them as buttons). If any other component is in between that should only scroll.
I don't believe that you can get this out of the box. Try looking at Flexbox, a lot of people have implemented this kind of layout over the years. Example: https://stackoverflow.com/questions/47659664/flexbox-with-fixed-header-and-footer-and-scrollable-content/47661523