How to avoid overlap between two divs position located inside relative div positioning?

Question

The following code works if there is enough space on the page to fit all the divs, but if I resize the page by at least two paragraphs, the absolute overlap. How can i avoid this?

This is my HTML:

<div id="div-chatroom">
    <div id="div-messages">messages here</div>
    <div id="div-sending">sending tools here</div>
</div>

This is my CSS:

#div-chatroom {
    position: relative;
    height: calc(100% - 70px); /* IE9+ and future browsers */
    height: -moz-calc(100% - 70px); /* Firefox */
    height: -webkit-calc(100% - 70px); /* Chrome, Safari */
    padding: 0;
    text-align: center;
    margin: 0;
    border-right: 2px solid #333333;
    overflow: auto;
}

#div-messages {
    position: absolute;
    top: 10px;
    bottom: 110px;
    left: 10px;
    right: 10px;
    min-height: 200px;
    overflow: auto;
}

#div-sending {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    height: 100px;
}

UPDATE # 1
If necessary, JSFiddle code (but if two divs have one position: absolute, this does not work).

Answer 1

Ok, I got the equivalent result by changing the approach.

CSS ( JSFiddle ):

#div-chatroom {
    position: relative;
    height: calc(100% - 70px); /* IE9+ and future browsers */
    height: -moz-calc(100% - 70px); /* Firefox */
    height: -webkit-calc(100% - 70px); /* Chrome, Safari */
    padding: 0;
    text-align: center;
    margin: 0;
    border-right: 2px solid #333333;
    background-color: #ffffff;
    overflow: auto;
}

#div-messages {
    position: relative;
    margin: 0;
    padding: 0;    
    min-height: 200px;
    height: calc(100% - 100px); /* IE9+ and future browsers */
    height: -moz-calc(100% - 100px); /* Firefox */
    height: -webkit-calc(100% - 100px); /* Chrome, Safari */
    background-color: green;
    overflow: auto;
}

#div-sending {
    position: relative;
    margin: 0;
    padding: 0;    
    height: 100px;
    background-color: red;
}

Answer 2

: - , , ( ), . , , , . jsfiddle, .