title: Fixed header with vertical scrollbar
body: <p>How can i have a <code>fixed header</code> with a vertical <code>scroll-bar</code> for my each <code>column</code>. </p>
  
  <pre><code>&lt;div class="header"&gt;&lt;/div&gt;
  &lt;div class="secondary-aside"&gt;&lt;/div&gt;
  &lt;div class="container"&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-sm-4"&gt;Title 1&lt;/div&gt;
        &lt;div class="col-sm-4"&gt;Title 2&lt;/div&gt;
        &lt;div class="col-sm-4"&gt;Title 3&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Below is my css...</p>
  
  <pre><code>html, body, .container {
      height:100%;
      width:100%; /*keep html and body 100% */
      margin:0;
      background:#e5e5e5;
  }
  .container {
      display:table;
      width: calc(100% - 260px);
      border-spacing:1.5em;
  }
  
  .row {
      display:table-row;
  }
  .col-sm-4 {
      display:table-cell;
      background:white;
  }
  .header{
    background:#E5E5E5;
    width:100%;
    height:60px;
  }
  
  .secondary-aside{
    width:260px;
    background-color:#E1E1E1;
    height:100%;
    right:0px;
    position:fixed;
  }
  </code></pre>
  
  <p>Below is my codepen
  <a href="http://codepen.io/anon/pen/lqfxt" rel="nofollow">http://codepen.io/anon/pen/lqfxt</a></p>