making an overlay sit perfectly centeral on any size screen

I have an element that I need 开发者_C百科to position horizontally and vertically central on screen, I don't doing this with jQuery, but how would I go about it, currently my code looks like this,

$("dd a, dt a, .job_listings a, #similar_jobs a").live("click", function(){
    var self = $(this);
    $("#overlay").fadeIn('slow');
    var targetProcent = 68;
    var targetWidth = $(window).width() * (targetProcent / 100);
    var targetHeight = $(window).height() * (targetProcent / 100);   
    var targetX = ($(window).width() - 827) / 2;
    var targetY = 75;
    $('#lightbox').load(self.attr("href"));
    //usePointFromPostcode(document.getElementById('postcode').value, placeMarkerAtPoint)
    $('#lightbox').css({
        "position": "absolute", 
        "top": $(window)+75+"px", 
        "left": targetX+"px"
    }).fadeIn('slow');
    //$('html, body').animate({scrollTop:0}, 'slow');
    return false;
});

@udders; may be you can define position :absolute to you element css

div{
width:300px;
height:300px;
top:50%;
left:50%;
margin-top:-150px;
margin-left:-150px;
}

give margin half of the element height & width

check thess links for more:

Centering things Vertically (and Horizontally)

Centering page content vertically