使用twitter bootstrap自动浮动

Question

我在row-fluid和span12中有一系列span4元素。我希望能够根据需要输出尽可能多的浮点数，并让它们自动排成3列。我的问题是这种情况会发生，但有一个偏移量(未清除的浮点偏移量)。

有没有一种方法可以做到这一点，而不需要计算每个框和第三个框，关闭前一行并开始一个新的行？

        <div id="content" class="clearfix row-fluid">

            <div id="main" class="span12 clearfix" role="main">

                <div class="row-fluid">
                    <div class="span4">Test</div>
                    <div class="span4">Test</div>
                    <div class="span4">Test</div>
                    <div class="span4">Test</div>
                    <div class="span4">TEst</div>
                </div>



            </div>


        </div>

Answer 1

如果你的盒子有不同的高度，这几乎是不可避免的。您可以通过使用Masonry jQuery plugin来解决此问题。

否则，您可以使用固定高度的盒子。

这是因为浮动元素脱离了正常的HTML文档流，并且在某些元素比它们的兄弟元素高时默认采用这种行为。