title: How do I center a DIV in the exact center of a page using jQuery?
body: <p>I need to center a DIV in the exact center of a page using jquery.  My CSS style for the DIV is as follows:</p>
  
  <pre><code>#page-content #center-box{
   position:absolute;
   width:400px;
   height:500px;
   background:#C0C0C0;
   border:1px solid #000;
   }
  </code></pre>
  
  <p>and my jQuery for centering is as follows:</p>
  
  <pre><code>windowheight = $(window).height();
  windowwidth = $(window).width();
  pagecenterW = windowwidth/2;
  pagecenterH = windowheight/2;
  $("div#page-content div#center-box")
      .css({top: pagecenterH-250 + 'px', left: pagecenterW-200 + 'px'});
  </code></pre>
  
  <p>This code does not invoke any action on my page when refreshed.  What am I doing wrong?</p>