What you need is a simply centering hack like this:
In this script, the left and top 50% is easy to understand, because it's aimed at locating the center of the page. However, this way the left-top corner would start from the center of the page, making it misaligned again. So the fix to that is to set a margin for both left and top of that div the value of half the negative height and width to set the center of the page located exactly the center of the div to create a perfectly centered div.
margin-left: -half of the div's width;
margin-top: -half of the div's height;