title: Avoiding double scrollbars with Grid Component and a website header
body: <p>I'm trying to add a website header to my site that uses the <code>&lt;Grid&gt;</code> component.  How do I nest the website header to avoid getting the browser scrollbar and the <code>&lt;Grid&gt;</code> scrollbar? </p>
  
  <p>I want to push the Grid down to allow for the website header while allowing the Window / Browser to control the scroll for both.</p>
  
  <p>I'm using these components 
  <code>&lt;WindowScroller&gt;&lt;AutoSizer&gt;&lt;Grid&gt;</code></p>
  
  <p><a href="https://i.stack.imgur.com/3vYOX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3vYOX.png" alt="enter image description here"></a></p>
  
  <p>I see on <a href="https://bvaughn.github.io/react-virtualized/" rel="nofollow noreferrer">https://bvaughn.github.io/react-virtualized/</a> the WindowScroller it works properly (using the <code>VirtualScroll</code> component).</p>
  
  <p><a href="https://i.stack.imgur.com/CpLzD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CpLzD.png" alt="enter image description here"></a></p>