title: Bootstrap columns not the same width
body: <p>I am trying out Bootstrap but when I use this code to create 1 navbar and then 2 content boxes, their widths are not the same... even if the widths all add up to 12:</p>
  
  <pre><code>&lt;div class="row" id="preview"&gt;
      &lt;!-- sidebar 1--&gt;
      &lt;div class="col-md-4 column" id="sidebar" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
      &lt;!-- main contents --&gt;
      &lt;div class="col-md-8 column"&gt;
          &lt;div class="row" id="main_contents"&gt;
              &lt;div class="col-md-4 column" id="content1" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
              &lt;div class="col-md-4 column" id="content2" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have tried this as well and this gives the same result:</p>
  
  <pre><code>&lt;div class="row" id="preview"&gt;
      &lt;!-- sidebar 1--&gt;
      &lt;div class="col-md-4 column" id="sidebar" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
      &lt;!-- main contents --&gt;
      &lt;div class="col-md-8 column"&gt;
          &lt;div class="col-md-4 column" id="content1" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
          &lt;div class="col-md-4 column" id="content2" style="border:1px solid; height:600px;"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>