html - Fixing a child div within its parent regardless of overflow -

I am trying to sit a child div on the bottom of my parent div relative to "div window"; That is, I want the child to be fixed in the lower part of the Div or whether the user should scroll.

When there is no content overflow, then I am able to accomplish this goal:

HTML:

    
 CSS:  
  #outer {status: relative; Overflow-y: scroll up; Red color; } #default {down: 0; Status: Completed; color blue; }   
 The result is:  
   
.  
 I have a problem in this: let me call  #inner  (blue box) to  #mount  ( Red box) should be fixed in the lower part - by any means on the scroll -  position: fixed  to use an effect in that div  height: 100% . But I want to achieve the effect using a div which has a set height which is not 100%.  
 I think this is a very easy solution, but I It can not be understood.  
 
 
 If you have a second outter  and 
 gt;  Then you have been statically depicted that element  #outter  div:  
 
 Alternatively, you can scrolling  & lt; Div & gt; Instead of , the code> position: sticky :  
 but I do not know what type of browser support you will get.