twitter-bootstrap - Twitter Bootstrap : Why do hidden elements affect layout?

Question

我有一个使用 Twitter Bootstrap 的流体网格布局系统的三列流体布局。三列由span4组成分区。我还使用了一个 jQuery UI 脚本，该脚本在该网格系统中将一个元素交换为另一个元素，这意味着在短时间内，我的行中实际上有一个隐藏的第四个元素。我会认为这不会是一个问题，因为隐藏的元素是隐藏的(“显示:无”)。

这是一个 jsfiddle:http://jsfiddle.net/dhilowitz/cfZwv/6/

我的问题是 :

为什么行中的元素不显示为一行？如果我把那个隐藏的元素去掉，一切都会很好。把它放回去，我的行中断并显示为两行。

HTML

<div class="container-fluid">
    <div class="row-fluid">
        <div class="hide"><h2>Item 1A</h2><p>Lorem ipsum dolor sit amet, consectetur</p></div>
        <div class="span4 element"><h2>Item 1B</h2>This is a node that should be treated exactly like the other ones.</div>
        <!--/span-->
        <div class="span4 element"><h2>Item #2</h2><p>Lorem ipsum dolor sit amet, consectetur</p></div>
        <!--/span-->
        <div class="span4 element"><h2>Item #3</h2><p>Lorem ipsum dolor sit amet, consectetur</p></div>
        <!--/span-->
    </div>
    <!--/row-->
</div>

Answer 1

由于 Bootstrap 中的这条规则:

.row-fluid [class*="span"]:first-child {
    margin-left: 0;
}

隐藏的元素仍然是 :first-child .