title: Centering div margin top and margin bottom
body: <p>I'm trying to get margin-top and margin-bottom to center my <code>&lt;div&gt;</code>. This JavaScript, which I wrote, works. However, if the site is cached once, <kbd>CTRL+F5</kbd> refresh causes the script to receive a wrong <code>clientHeight</code>. Refreshing second time, retrieves the correct <code>clientHeight</code>.</p>
  
  <p>I've tried using <code>window.load</code> and this works. However, it is so slow that the <code>&lt;div&gt;</code> loads and after 2 seconds, it shifts to the middle.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    var height = $(window).height();
    var clientHeight = document.getElementById('account-wall').clientHeight;
    var calc_height = (height - clientHeight) / 2;
    document.getElementById("account-wall").style.marginTop = calc_height + 'px';
    document.getElementById("account-wall").style.marginBottom = calc_height + 'px';
  &lt;/script&gt;
  
  
  &lt;script type="text/javascript"&gt;
    $(window).load(function() {
      var height = $(window).height();
      console.log(height);
      var clientHeight = $('.account-wall').height();
      console.log(clientHeight);
      var calc_height = (height - clientHeight) / 2;
      document.getElementById("account-wall").style.marginTop = calc_height + 'px';
      document.getElementById("account-wall").style.marginBottom = calc_height + 'px';
    });
  &lt;/script&gt;
  </code></pre>