title: Bootstrap 3: Remove bottom margin from the columns at the bottom of row
body: <p>I have a grid with multiple columns. All columns are in one row and the number of columns may vary.</p>
  
  <p>Since I needed some vertical space between columns, I added margin-bottom on columns.</p>
  
  <p>However, I want equal space <strong>between wrapper and the columns</strong> so I need to remove margin-bottom on last few columns in the row. </p>
  
  <pre><code>See sample here: https://jsfiddle.net/aucovic/rhhyu6h2/6/
  </code></pre>
  
  <p>How would I dynamically remove bottom-margin on those last few columns? </p>
  
  <pre><code>&lt;style&gt;
  .wrapper {
    background:#000;
    padding:10px;
  }
  
  .box {
    background: #fff;
  }
  
  .mb {  
    margin-bottom:10px;
  }
  &lt;/style&gt;
  
  
  &lt;div class="wrapper"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-md-4 col-xs-6 mb"&gt;
        &lt;div class="box"&gt;
          Box 1
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4 col-xs-6 mb"&gt;
        &lt;div class="box"&gt;
          Box 2
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4 col-xs-6 mb"&gt;
        &lt;div class="box"&gt;
          Box 3
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4 col-xs-6 mb"&gt;
        &lt;div class="box"&gt;
          Box 4
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4 col-xs-6 mb"&gt;
        &lt;div class="box"&gt;
          Box 5
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>