如何禁用引导列中的垂直滚动

我有两个引导列“左”和“右”；我想用屏幕修复左栏并禁用滚动。但我想在右列中启用滚动，这将有更多内容。基本上我想显示帖子，使帖子标题显示在左列中，帖子内容显示在右列中 完全相同this。注：我用过overflow-y: hidden;但没有成功。这就是我想要实现的目标：https://blog.squarespace.com/blog/introducing-promotional-pop-ups

这是我的左栏代码：

<div id="main" class="col-md-6 left-half ">
  <h2 style="diplay:inline-block">Intrigue</h2> 
  <input id="morearticlesbtn" class="button" type="button" onclick="openNav()" value="More Articles "> 
  <div class="row">
  <div class="post-meta col-md-6">
      <p>July 18, 2017</p>
      <p>By: James Crock</p>
      <a href="#"> Transport</a> 
  </div>
      <div class="col-md-6">
          <div class="line"></div>
      </div>
  </div>


  <div class="title-div">
  <h1 class="title">Squarespace Sponsors 2017 D&AD New Blood Awards</h1>
  </div>

  <div class="row">
      <div class="col-md-9" >
          <div class="line bottom-line"></div>
      </div>
  <div class="col-md-3 bottom-line-text">
  <h4>Next</h4>
  </div>

    </div>
    </div>

这是CSS代码：

.left-half{
    height: 100%;
    overflow-y:hidden;
    position: fixed;
    bottom: 0;
    height: 100vh;

}
.left-half h2{
    display: inline-block;         
}

只需添加positon:fixed and height:100%到您的左列并将数据添加到您的右列

https://codepen.io/anon/pen/JJgjqX