我目前正在使用 Twitter bootstrap 构建一个网站（这太棒了！）。
我的布局使用：
<div class="row">
<div class="span6"></div>
<div class="span6"></div>
<div class="span6"></div>
<div class="span6"></div>
</div>
效果很好，基本上每行有 2 个 div，而且我们不必在循环中包含计数器来消除边距。它是完美的！但我们决定改变对固定布局的想法，所以我从 .row 切换到 .row-fluid。而这时候问题就来了。
我知道有这样的事情：
<div class="row-fluid">
<div class="span6"></div>
<div class="span6"></div>
<div class="span6"></div>
<div class="span6"></div>
</div>
带有 .span6 的 div 对于第一行效果很好，但是 .span6 上的 margin-left 从第二行开始显示，因此布局……不好。
I'm 惊讶的是它对于固定布局但不是行流体效果惊人。有解决方法吗？我在我的所有网站上都使用了这个，因此必须为所有网站添加计数器......工作量太大。
这是 JS 小提琴：http://jsfiddle.net/denislexic/uAs6k/3/ http://jsfiddle.net/denislexic/uAs6k/3/
任何帮助表示赞赏，谢谢。
你的 2 个例子实际上有 4 个<div class="span6"></div>在全角“行”内...总计为“24”，或者是“行”或“行流体”宽度的两倍（基于 12 列网格设置）。当父行的宽度内有太多浮动时，您基本上会创建删除浮动。
（这也是为什么“margin-left:0”似乎没有应用于您的第三个“span6”，这looks就像它是第二行的第一个“span6”。)
在默认/固定“行”中，嵌套列的 'span*'s + 'offset*'s 将需要小于或等于其父列的 'span*'，或者如果它是第一级行，则为 12，因为浮动的 'span* ' 宽度以像素为单位。
在灵活/流动的“行流体”中，列宽按百分比设置，因此每行和嵌套行可以有嵌套列“span*”和“offset*”，每次加起来为 12。http://twitter.github.com/bootstrap/scaffolding.html#fluidGridSystem http://twitter.github.com/bootstrap/scaffolding.html#fluidGridSystem
这应该可以解决“row-fluid”设置的问题。http://jsfiddle.net/csabatino/uAs6k/9/ http://jsfiddle.net/csabatino/uAs6k/9/
<h1>NOW this is working.</h1>
<div class="row-fluid">
<div class="span6">Content</div>
<div class="span6">Content</div>
</div>
<div class="row-fluid">
<div class="span6">Content</div>
<div class="span6">Content</div>
</div>
<h1>Default fixed 'row' is working, too.</h1>
<div class="row">
<div class="span6">Content</div>
<div class="span6">Content</div>
</div>
<div class="row">
<div class="span6">Content</div>
<div class="span6">Content</div>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
