title: Chrome vertical jump when refreshing page scrolled to bottom
body: <p>In noticed the following behavior when developing a website using Chrome: when I refresh the page while it's being scrolled fully to bottom I can observe a vertical jump.</p>
  
  <p>See the following <a href="http://www.bootply.com/xxYMqG10ME" rel="nofollow">Bootply</a>.</p>
  
  <p>To reproduce, open the fullscreen preview (the monitor icon on the right), and try the following:</p>
  
  <ol>
  <li>refresh the page (confirm form resubmission) --> no jump</li>
  <li>scroll to middle, refresh (confirm form resubmission) --> no jump</li>
  <li>scroll to very bottom, refresh (confirm form resubmission) --> vertical jump</li>
  </ol>
  
  <p>The jump is in fact caused by this Javascript that tries to maintain vertical rhythm when page contains figures with <code>.align-center</code> class:</p>
  
  <pre><code>$(document).ready(function() {
    $(window).resize(function() {
      var baseline = parseInt($('body').css('line-height'), 10)
      $('.align-center').each(function() {
        var height = $(this).outerHeight();
        console.log(height)
        var bottom = baseline - (height % baseline);
  
        if (bottom != 0)
        {
          bottom += parseInt($(this).css('padding-bottom'), 10)
          $(this).css('padding-bottom', bottom);
        }
      });
    }).trigger("resize");
  });
  </code></pre>
  
  <p>Of course removing this Javascript also removes the vertical jump observed.
  What I don't understand is that padding is applied when DOM is ready so it shouldn't cause visible vertical jumps. I think the jump has to do with the way Chrome handles the viewport when page is scrolled to very bottom but I don't really know how to confirm/infirm this.</p>
  
  <p>When trying this in Firefox or Safari, I don't observe any jump.</p>
  
  <p>Any idea please?</p>
  
  <hr>
  
  <p>Edit: <a href="https://code.google.com/p/chromium/issues/detail?id=374938" rel="nofollow">I opened a bug on Chrome's bug tracker</a>.</p>