4

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

这是一个jsfiddle: http: //jsfiddle.net/dhilowi ​​tz/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>
4

1 回答 1

6

由于引导程序中的这条规则:

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

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

于 2013-07-02T16:46:16.847 回答