Place an item at a fixed position in a scrolling div

Question

I have a page full of content and window is scrollable, in which there is scrollable div where my objective is to place an icon at the very bottom

Answer 1

A standardly supported way is to edit the HTML markup and add a wrapper element to both the scrollable and the "fixed" element - which will now have position: absolute; instead:

#wrapper {  /* ADDED */
  position: relative;
  width: 200px;
}

#scrollable {
  height: 100px;
  border: 1px solid;
  overflow: auto;
  position: relative;
}

#wrapperFooter {
  background: red;
  position: absolute; /**/
  bottom:0;
}

  

    

  
  
ABSOLUTELY! :)