title: Why isnt my div not scrolling in an affix menu?
body: <p>I have a right side bar, which is for a shopping cart. The problem I am facing is when bootstrap adds the "affix" class, and then there is an overflow, the content does not scroll even when I set it the item-cont-scroll class to auto scroll</p>
  
  <p>What always ends up happening is the content gets cut off in the bottom</p>
  
  <p>I have been trying already a day and,  to get the overflow to scroll and still can't seem to find a solution. I have set the height to 100%, created a parent div with a relative position, still doesn't work, </p>
  
  <p>I have tried so many ways and I can't seem to find a way to get this to work. </p>
  
  <p>The following link below,is an example of another website, that already has what I am trying to achieve. If you click on the link and select pick up order, you will see that there side bar is fixed, when you add more food items to the cart are being added to the cart.</p>
  
  <p><a href="https://www.grubhub.com/restaurant/bareburger-85-2nd-ave-new-york/266100" rel="nofollow noreferrer">https://www.grubhub.com/restaurant/bareburger-85-2nd-ave-new-york/266100</a></p>
  
  <p>Below is an just a brief outline of my actual code.You will notice when you  scroll past the offset which is set to 130px, the cart will get cut off</p>
  
  <p>I am really confused on why this is not working. Below is the code the my page  and link to my js fiddle</p>
  
  <p>Any help would be really appreciated</p>
  
  <p><a href="https://jsfiddle.net/eldan88/7gyk8hm4/#&amp;togetherjs=Iq2LrSwBUP" rel="nofollow noreferrer">https://jsfiddle.net/eldan88/7gyk8hm4/#&amp;togetherjs=Iq2LrSwBUP</a></p>
  
  <pre><code> &lt;style&gt;
  
  
          .categories {
  
              border-bottom: solid 1px lightgray;
  
          }
  
  
         #item-cont-scroll{
  
             overflow: auto;
  
         }
  
          header{
              height: 200px;
          }
  
          .affix{
              top:0;
          }
  
      &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  
  
  &lt;article class='container'&gt;
  
      &lt;header&gt;
          Logo goes here
          &lt;/header&gt;
  
  &lt;div class='row'&gt;
  
      &lt;div class='col-sm-8'&gt;
  
  
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
          &lt;h2 class='categories'&gt; Test&lt;/h2&gt;
  
  
  
      &lt;/div&gt;
  
  
      &lt;div class='col-sm-4'&gt;
  
  
      &lt;section data-spy='affix' data-offset-top='130' &gt;
  
  
  
              &lt;h1&gt; Item name &lt;/h1&gt;
  
              &lt;h2&gt; Item Description &lt;/h2&gt;
           &lt;div id='item-cont-scroll'&gt;
              &lt;h2&gt;Option Category 1 &lt;/h2&gt;
  
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
  
              &lt;h2&gt;Option Category 2 &lt;/h2&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
  
                 &lt;h2&gt;Option Category 3 &lt;/h2&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
              &lt;div&gt; Item options &lt;/div&gt;
  
  
  
      &lt;/div&gt;
      &lt;/section&gt;
  
  
  
      &lt;/div&gt;
  
  
  &lt;/div&gt;
  
  &lt;/article&gt;
  </code></pre>