title: Stick to bottom when scrolling down and stick to top when scrolling up
body: <p>I have to position a div to the bottom of the screen once it reaches the end. And the other content should be scrollable</p>
  
  <p>I have already tried finding out the height of the div and then triggering an event so as to fix the position at the bottom</p>
  
  <pre><code> &lt;div class="home"&gt;
   &lt;div class="col-lg-9 no-padding feed"&gt;
    &lt;app-birthday&gt;&lt;/app-birthday&gt;
     &lt;div scrollEnd [scrollDisabled]="!showMore" 
      (scrollDown)="showMoreList()"&gt;
      &lt;app-news-feed
        (getFilterValFromChild)="receiveFilterInParent($event)"
        [newsFeed]="newsFeed"
      &gt;&lt;/app-news-feed&gt;
    &lt;/div&gt;
   &lt;/div&gt;
   &lt;div class="col-lg-3 no-padding side"&gt;
      &lt;app-holiday-list&gt;&lt;/app-holiday-list&gt;
      &lt;app-corporate-block&gt;&lt;/app-corporate-block&gt;
      &lt;app-aboutus-menu&gt;&lt;/app-aboutus-menu&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  
    constructor(
     private logger: LoggerService,
     private homeService: HomeService
    ) {}
    ngOnInit() {
    this.getNews();
    }
  
    getNews() {
    this.homeService
    .getNewsFeed(this.category, this.subCategory, this.pageNum, 
    this.limit)
    .subscribe(res =&gt; {
      this.logger.log(res.body);
      if (this.pageNum == 1) this.newsFeed = res.body.pinnedposts;
      this.newsFeed = this.newsFeed.concat(res.body.nonPinnedPosts);
      if (res.body.nonPinnedPosts.length === this.limit) this.showMore 
     = true;
    });
    }
  
    showMoreList() {
    this.pageNum++;
    this.logger.log(this.pageNum);
    this.showMore = false;
    this.getNews();
    }
  
    receiveFilterInParent(filterVal: String) {
    this.category = filterVal;
    this.pageNum = 1;
    if (filterVal == "all") this.category = "";
    this.getNews();
    }
  </code></pre>
  
  <p>I expect it to be like in the "Facebook Website" where you get the stories and suggested groups on the right hand side of the main content. If you look at it carefully you will find that when you scroll it scrolls till the end along with the main content and then stops after the right hand side content has nothing to display. And the only the main content scrolls. 
  But the actual output which I am getting is that both the main content and the right hand side content in my case is getting scrolled.</p>
  
  <p><a href="https://i.stack.imgur.com/lMmVs.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/lMmVs.jpg" alt="Expected"></a></p>
  
  <p><a href="https://i.stack.imgur.com/knhyp.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/knhyp.jpg" alt="Actual"></a></p>