Setting scroll height of a DIV using javascript and css

I have this div which pops up when an action is triggered. When I scroll down the page, it still remains on top of page. I want to set the scroll height so it moves in relative position to the page scroll. Simply making the position : relative does not work. How can I use javascript get this? Help.

    <form name="" action="" method="POST">
     <div id='divSearchAndReplace'>
     <table id='divSearchAndReplace_Header' width='100%'>               
     <tr>
        <td>                        
            <table>
            <tr>
                <td align='left'></td>
            </tr>
            </table>                    
        </td>                   
    </tr>
    </table>

    <table width='100%' border='0' cellspacing="4" cellpadding="2">             
    <tr><td colspan='2' nowrap height='10px'></td></tr>
    <tr valign="top">

    </tr>
    <tr><td colspan='2' align='right' style='padding-right:12px;'><input class='form_button' type='submit' name='btnSubmit' value='Replace' onclick='return checkSearchAndReplace();'/></td></tr>    
    </table>
</div>
</form>

this is the css

#divSearchAndReplace { width:450px; height:240px; border:1px solid #336699; background-color:#ffffff; position:absolute; left:200px; top:75px; display:none; }
#divSearchAndReplace table { width:450px; border:0px; align:center; }