title: Google Chrome cutting off bottom of long pages
body: <p>I'm developing a website and whenever I load a pretty long page on chrome, it creates some sort of a box that covers up the bottom portion of my page. The long pages look fine on Safari and Firefox; it's only Chrome that is causing this problem.</p>
  
  <p>Here's what the behavior looks like: </p>
  
  <p><a href="https://i.stack.imgur.com/EzQdq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EzQdq.png" alt="enter image description here"></a></p>
  
  <p>And here's the page with the issue: <a href="https://nosh-staging.herokuapp.com/events" rel="nofollow noreferrer">https://nosh-staging.herokuapp.com/events</a>
  If you keep scrolling to the bottom, you'll notice the giant white box that covers the last 15% - 20% of the page.</p>
  
  <p>Few quirks I've noticed: </p>
  
  <ol>
  <li><p>I'm using a 15" MBP (1440 x 900 resolution screen) and a 27" Thunderbolt display (2560 x 1440). When I open up Chrome in the Thunderbolt display, the page loads just fine. As soon as I move the window to my 15" screen, it just covers up the whole bottom part of the page.</p></li>
  <li><p>When I inspect the elements, all the codes seem to load just fine. It almost feels like Chrome is putting up a huge box on top of the page. When I try to click + drag to select text, I can't see the selection because of the box.</p></li>
  </ol>
  
  <p>I'm currently developing on Rails 3.2.13 and Ruby 2.0.0. Tested the pages on Chrome ver. 30.0.1599.101, Firefox ver. 25.0, and Safari 7.0. I've tried disabling all the extensions and loading the page, but that did not help either.</p>