title: Bootstrap Sidebar Not Scrollable 100% Height
body: <p>I currently have a Bootstrap Sidebar on the left part of my screen. <code>height</code> is set to <code>100%</code>. But when content goes past the bottom of the screen it's not scrollable.</p>
  
  <p>I saw <a href="https://stackoverflow.com/questions/28375553/scrollable-sidebar-using-bootstrap#28376048">this Stack Overflow</a> question which is very similar to my problem. One of the comments mentions that it could be due to my height being set to 100%.</p>
  
  <p>I have tried to set my height to 100px just as a test to see if the content would become scrollable, and that worked.</p>
  
  <p>So my question is, is there a way to make the content in my sidebar scrollable and keep the height at <code>100%</code> instead of having to set a specific pixel value?</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>Below is my current CSS for <code>#sidebar-wrapper</code>.</p>
  
  <pre><code>#sidebar-wrapper {
      overflow-y: scroll;
      z-index: 1000;
      position: fixed;
      left: 175px;
      width: 175px;
      height: 100%;
      margin-left: -175px;
      overflow-y: auto;
      background: #222222;
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      transition: all 0.5s ease;
  }
  </code></pre>