title: twitter bootstrap table alignment
body: <p>I'm using twitter bootstrap and trying to get two tables to align. I'm starting to think I'm going about it the wrong way. I have two tables one with 3 columns and one with 2 columns. I've set the 3 column table to span6, span2,span4. I've set the 2 column table to span6 and span6. They don't seem to always align in the middle depending on page width. Is there any way to accomplish this?</p>
  
  <p>Example:
  <a href="http://jsfiddle.net/PSBtr/" rel="nofollow">http://jsfiddle.net/PSBtr/</a></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;&lt;link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet"&gt;&lt;/head&gt;
  
      &lt;body&gt;
  
      &lt;table class="table table-bordered table-condensed"&gt;
      &lt;thead&gt;
      &lt;tr&gt;
          &lt;th class="span6"&gt;fdsafdfdf f dfdafs sd&lt;/th&gt;
          &lt;th class="span2"&gt;tesaaat&lt;/th&gt;
          &lt;th class="span4"&gt;ffdsfsd d&lt;/th&gt;                     
      &lt;/tr&gt;
  &lt;/thead&gt;
  
  &lt;/table&gt;
  
  &lt;table class="table table-bordered table-condensed"&gt;
  &lt;thead&gt;
  &lt;tr&gt;
      &lt;th class="span6" &gt;fdfdf  fds f &lt;/th&gt;
      &lt;th class="span6"&gt;test&lt;/th&gt;
  &lt;/tr&gt;
  &lt;/thead&gt;
  
  &lt;/table&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;​​​​​​​​​​​
  </code></pre>
  
  <p>Ultimately I'm trying to design a somewhat fluid layout that also has tables that will expand but have a minimum size. Any additional suggestions on which layout (from bootstrap) could accomplish this would also be helpful. </p>
  
  <p>Thanks!</p>