Positioning of jQuery div

So i have link to shows a hidden div, that has this following CSS applied to it:

.ind-infoNode {
    display:none;
    background:url(/_images/employer-toggle-bg.png) 0 0 no-repeat; 
    height:250px; 
    width:645px;
    padding:20px 35px 30px 20px;
    position:absolute;
    margin:0;
}

When the div is displayed it shows up essentially right in the middle of the screen where the link is located on the page, that is in FireFox and Chrome...HOWEVER

In IE, it shows up at the very bottom of the page, under al开发者_JS百科l of the content on the page..

What can i do to resolve this?

Here is the js used:

$(document).ready(function() {
    $("a[id^=ind-info-lnk]").live("click", function () { 
        var num = this.id.split(/-(?:lnk)?/).pop(); 
        $('#ind-info-'+num).show(); 
        return false; 
    });  

    $(function() { 
        $(document).keypress(function(e) {   
            if (e.which == 27) {  
                $('.ind-infoNode').hide();  
            }  
        });  
        $('a.close').click(function() {   
            $('.ind-infoNode').hide();  
            return false;   
        }); 
    }); 
});

If you use position: absolute you have to make sure, that the parent element also has a css-property for position, no matter which value it has. May be this solves your problem in IE.

Could it be that since you are positioning it absolute, top, left, bottom, and/or right needs to defined in your CSS?

Have you tried moving the div to the top of your body element?