自动高度的CSS div始终位于底部

Question

＆＃13;

＆＃13;

.comments_modal {
  height:100%;
    border:1px solid red;
    width: 250px;
}
.footer {
    min-height:100px;
    border:1px solid blue;

    width: 250px;
    vertical-align: bottom;
}
.main_div {
    width: 250px;
    height:100%;
    border:3px solid black;
}

＆＃13;

<div style="height:100%; width:300px; position: absolute;">
    
    <div class="main_div">
    
    <div class="comments_modal">
float height block
</div>
        
    <div  class="footer">
        
        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg        dfgdfgdfg
    </div>
    
    </div>
    
</div>

＆＃13;

＆＃13;

＆＃13;

我有漂浮的高度页脚（100px - 300px）。我无法将自动高度的div始终放在底部。此外，主要div应该是＆＃34; position：absolute＆＃34; Result