title: Nesting a container class inside a container-fluid class in Bootstrap 3?
body: <p>Aside from the padding issue, why is it not advisable to nest .container in .container-fluid? </p>
  
  <p>If you zero the child container padding (as shown in my code below), the effect is the same as having one container anyway. Also, it seems that having varying full and fixed width layout is pretty common these days. I know what the documentation says (<a href="http://getbootstrap.com/css/#overview-container" rel="noreferrer">LINK</a>), but I am curious if anyone knows of anything other than the padding issue that warrants this implementation not being recommended. Is it the additional markup or something else I am missing? </p>
  
  <p>The reason I ask is that I have this implemented on a number of sites recently and seen no apparent problems with it in the testing that I have done. I am wondering if there are some other potential problem(s) lurking that would be cause for me to consider stopping this practice.</p>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.container-fluid .container {
      padding-left:0;
      padding-right:0;
  }
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="container-fluid" style="background-color:aliceblue;"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-xs-12"&gt;
              &lt;div class="container"&gt;
                  &lt;div class="row"&gt;
                      &lt;div class="col-xs-6" style="background-color:violet"&gt;Use this document as a way to quickly start any new project.&lt;br&gt; All you get is this text and a mostly barebones HTML document.&lt;/div&gt;
                      &lt;div class="col-xs-6" style="background-color: lightblue"&gt;Use this document as a way to quickly start any new project.&lt;br&gt; All you get is this text and a mostly barebones HTML document.&lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt; 
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-xs-4" style="background-color:pink"&gt;Use this document as a way to quickly start any new project.&lt;br&gt; All you get is this text and a mostly barebones HTML document.&lt;/div&gt;
        &lt;div class="col-xs-4" style="background-color: red"&gt;Use this document as a way to quickly start any new project.&lt;br&gt; All you get is this text and a mostly barebones HTML document.&lt;/div&gt;
        &lt;div class="col-xs-4" style="background-color:blue"&gt;Use this document as a way to quickly start any new project.&lt;br&gt; All you get is this text and a mostly barebones HTML document.&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="http://www.bootply.com/I3EInWQJpL" rel="noreferrer">Example on Bootply</a></p>