title: Disable scroll bar in header but not in content for a web page
body: <p>I have a simple web page with header and content, it may look like</p>
  
  <pre><code>&lt;div id="wrap"&gt;
      &lt;div id="header"&gt;
      &lt;/div&gt;
      &lt;div id="content"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>By default, it have a scroll bar in the right, but I want to disable/freeze the scroll bar in header, but remain it in content, is it possible to do this by javascrip/jquery or css?</p>
  
  <p>Thanks</p>
  
  <p>BEFORE
  <img src="https://i.stack.imgur.com/CKo5b.png" alt="enter image description here"></p>
  
  <p>AFTER
  <img src="https://i.stack.imgur.com/jMBzg.png" alt="enter image description here"></p>