title: Bootstrap 3 - Why is row class is wider than its container?
body: <p>I just started using Bootstrap 3. I am having a difficult time 
  understanding how the row class works.
  Is there a way to avoid the <code>padding-left</code> and <code>padding-right</code>?</p>
  
  <pre><code>&lt;div class="row" style="background:#000000"&gt;           
    &lt;div class="col-xs-4 .col-xs-offset-1"&gt;
      col
    &lt;/div&gt;
    &lt;div class="col-xs-2"&gt;
      col
    &lt;/div&gt;
    &lt;div class="col-xs-2"&gt;
      col
    &lt;/div&gt;
    &lt;div class="col-xs-2"&gt;
      col
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/petran/rdRpx/" rel="noreferrer">http://jsfiddle.net/petran/rdRpx/</a></p>