为什么我的Bootstrap CSS div不能很好地堆叠？

Question

我在Bootstrap遇到了麻烦,这里有些人似乎都知道.我根据基本的"行"类网格约定设置了以下两个div,但是当我减小浏览器屏幕的大小时,它们没有按预期堆叠.他们只是保持固定.

更新:

当我链接到bootstrap-responsive.css文件时,Bootstrap变得响应,如下所示.

但是,这些盒子超出了我预期和设置的最大网格尺寸(即原始安装中出现的默认值为940px,我再次通过LESS再次编译它来重新确认).而且,它实际上超出了浏览器窗口的最右侧范围.Chrome浏览器的屏幕截图(17.0.963.56)(截图中的开发者工具中可见更多标记):

http://static.inky.ws/image/1457/image.jpg

无论是否包含以下内容都会发生这种情况

也许我以错误的方式使用bootstrap,但是我希望它能够响应所选的div(被归类为"row","spanX"等),但要停留在我选择的最大网格宽度上,并且至少要停在远处的窗户!

再次感谢您的时间,马特

HTML:

<div class="row-fluid"><!-- Intro begin -->
    <div class="span6">
        <p style="font-size: 18px;">
            <strong><span style="font-size: 20px;">Mingo makes it easy to share food with other people in your area.</span></strong>
        </p>
    </div>

    <div class="span6">
        <!--<img src="{{STATIC_URL}}images/pics/how_it_works.png" width="350px" style="margin-right: 20px;" />-->
        <div style="background-color: #E7F5DF; height: 250px; padding: 8px; border-radius: 8px;">
            <ul class="nav nav-pills" style="float: right;">
                <li class="active"><a href="#">How it works</a></li>
                <li><a href="#">Save time, save money</a></li>
            </ul>
            <div style="width: 99.5%; height: 87.5%; background-color: #c6e3b6; margin: 9.5% 0 0; border-radius: 8px; moz-border-radius: 8px;">
            </div>
        </div>
    </div>
</div><!-- Intro end -->

Answer 1

也许你只包括bootstrap.css样式表而不是bootstrap-responsive.css样式表？

如果是这种情况,请尝试包括两者.

使用HTML标记和两个CSS文件,它似乎有效:http://jsfiddle.net/TimPetricola/KFnxs/