我正在使用twitter引导程序，试图让两个表对齐。我开始觉得我走错了路。我有两张表，一张有三列，一张有两列。我已将3列表设置为span6、span2、span4。我已将2列表设置为span6和span6。根据页面宽度的不同，它们似乎并不总是在中间对齐。有什么办法可以做到这一点吗？
例子：
http://jsfiddle.net/PSBtr/
<html>
<head><link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css" rel="stylesheet"></head>
<body>
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th class="span6">fdsafdfdf f dfdafs sd</th>
<th class="span2">tesaaat</th>
<th class="span4">ffdsfsd d</th>
</tr>
</thead>
</table>
<table class="table table-bordered table-condensed">
<thead>
<tr>
<th class="span6" >fdfdf fds f </th>
<th class="span6">test</th>
</tr>
</thead>
</table>
</body>
</html>
最后，我试图设计一个有点流畅的布局，其中也有将展开但有最小大小的表。任何关于哪个布局（从引导）可以实现这一点的额外建议也会有帮助。
谢谢！
最佳答案
下面的代码将实现您想要实现的目标：
<table class="table table-bordered table-condensed">
<thead>
<tr class="span12">
<th class="span6">fdsafdfdf f dfdafs sd</th>
<th class="span2">tesaaat</th>
<th class="span4">ffdsfsd d</th>
</tr>
</thead>
</table>
<table class="table table-bordered table-condensed">
<thead>
<tr class="span12">
<th class="span6">fdfdf fds f </th>
<th class="span6">test</th>
</tr>
</thead>
</table>
对于问题的后面部分，很难说，因为这取决于确切的要求，但可以，您可以尝试一列Fluid layout。如果用户浏览的是紧凑型屏幕大小，则必须考虑Responsive design。