title: How to disable vertical scroll in bootstrap column
body: <p>I have two bootstrap columns "left" and "right"; I want to fix the left column with the screen and disable scroll. but i want to enable scroll in the right column which would have more content. Basically i want to display posts such that the post heading would display in left column and the post content would display in right column Exactly like <a href="https://blog.squarespace.com/blog/introducing-promotional-pop-ups" rel="nofollow noreferrer">this</a>  . Note: I have used <code>overflow-y: hidden;</code> but it did'nt worked. This is what i want to achieve: <a href="https://blog.squarespace.com/blog/introducing-promotional-pop-ups" rel="nofollow noreferrer">https://blog.squarespace.com/blog/introducing-promotional-pop-ups</a></p>
  
  <p>this is my code for left col:</p>
  
  <pre><code>&lt;div id="main" class="col-md-6 left-half "&gt;
    &lt;h2 style="diplay:inline-block"&gt;Intrigue&lt;/h2&gt; 
    &lt;input id="morearticlesbtn" class="button" type="button" onclick="openNav()" value="More Articles "&gt; 
    &lt;div class="row"&gt;
    &lt;div class="post-meta col-md-6"&gt;
        &lt;p&gt;July 18, 2017&lt;/p&gt;
        &lt;p&gt;By: James Crock&lt;/p&gt;
        &lt;a href="#"&gt; Transport&lt;/a&gt; 
    &lt;/div&gt;
        &lt;div class="col-md-6"&gt;
            &lt;div class="line"&gt;&lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
  
  
    &lt;div class="title-div"&gt;
    &lt;h1 class="title"&gt;Squarespace Sponsors 2017 D&amp;AD New Blood Awards&lt;/h1&gt;
    &lt;/div&gt;
  
    &lt;div class="row"&gt;
        &lt;div class="col-md-9" &gt;
            &lt;div class="line bottom-line"&gt;&lt;/div&gt;
        &lt;/div&gt;
    &lt;div class="col-md-3 bottom-line-text"&gt;
    &lt;h4&gt;Next&lt;/h4&gt;
    &lt;/div&gt;
  
      &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>This is css code:</p>
  
  <pre><code>.left-half{
      height: 100%;
      overflow-y:hidden;
      position: fixed;
      bottom: 0;
      height: 100vh;
  
  }
  .left-half h2{
      display: inline-block;         
  }
  </code></pre>