将div置于父div的底部

Question

Code:

<div id="divPopUp" style="border: 2px solid gray; padding: 20px; width: 700px; background: white; height: 450px; ">
     <h1 style="text-align:center">Handsets</h1>

             <table>
               some table content 
             </table>  
    <div class="footerButtons" style="display: block;">
        <div style="float: left;">
            <input type="button"/>
        </div>
        <div style="float: left; margin-left: 207px;">
         <input type="button"/> <input type="button"/>
        </div>
    </div>  
</div>

I need to put div with class "footerButtons" to bottom of the main div. How can I do it?

Answer 1

I have add position:relative to your main div and position:absolute; bottom:10px position:absolute; bottom:10px to your div with class footerButtons to make it always near the bottom like this

Hope this help!

<div id="divPopUp" style="border: 2px solid gray; padding: 20px; width: 700px; background: white; height: 450px; position:relative">
 <h1 style="text-align:center">Handsets</h1>

<table>some table content</table>
<div class="footerButtons" style="display: block; position:absolute; bottom:10px">
    <div style="float: left;">
        <input type="button" />
    </div>
    <div style="float: left; margin-left: 207px;">
        <input type="button" />
        <input type="button" />
    </div>
</div>