title: Divs don't span whole width.
body: <p>Looking at other SO questions, I managed to get the left divs span the whole page, but not the right divs. How do I fix this problem?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="container-fluid"&gt;
  
   &lt;div class="row col-lg-6 col-md-6 col-sm-6 col-xs-6"&gt;
  
      &lt;div id="kpop" class="selection"&gt;
  
      &lt;/div&gt;
  
  
      &lt;div id="fashion" class="selection"&gt;
  
      &lt;/div&gt;
  
   &lt;/div&gt;
  
  
   &lt;div class="row col-lg-6 col-md-6 col-sm-6 col-xs-6"&gt;
  
     &lt;div id="martialarts" class="selection"&gt;
  
     &lt;/div&gt;
  
     &lt;div id="nature" class="selection"&gt;
  
     &lt;/div&gt;
  
   &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>CSS: </p>
  
  <pre><code>body .container-fluid {
    padding-left: 0;
    padding-right: 0;
  }
  
  .selection {
    height: 50vh;
  }
  </code></pre>
  
  <p>Here's a demo:
  <a href="http://codepen.io/davegumba/pen/QNzpey" rel="nofollow">http://codepen.io/davegumba/pen/QNzpey</a> </p>