Question

我无法使用bootstrap行流体网格系统让我的网页符合我的屏幕的确切宽度。现在，我看到一个水平滚动条出现，但我认为它应该适合我的屏幕宽度！我做错了什么？

这是我的代码：

@gridColumns: 24;
@fluidGridColumnWidth: 3.2%;
@fluidGridGutterWidth: 1.0086956%;

<body>
    <div class='row-fluid'>
        <div id='leftbar' class='span3'>
        </div>
        <div id='content-wrapper' class='span17'>
            <div class='row-fluid'>
                <div id='header' class='span24'>
                    <div class='row-fluid'>
                        <div class='span8 header'>
                        </div>
                        <div class='span8 header'>
                        </div>
                        <div class='span8 header'>
                        </div>
                    </div>
                </div>
                <div id='flash-message' class='span24 center'>
                </div>
                <div id = 'content' class='span24'>
                   <div class='row-fluid'>
                        <div id = 'content-left' class='span10 center'>
                        </div>
                        <div id = 'content-right' class='span14 center'>
                        </div>
                   </div>
                </div>
            </div>
        </div>
        <div id='rightbar' class='span4'>
        </div>
        <div id = 'footer' class='span24'>
        </div>
    </div>
</body>

Answer 1

您是否尝试在“容器”类中包含代码？来自Bootstrap's docs :.

而且，至少在您的示例代码中，您的行与正确的跨度数不匹配。最顶行包含以下跨度：3 + 17 + 4 + 24（页脚）= 48.内部行再次出现同样的问题。

要修复它，只需为每组24（或更少）跨度声明一个新行。

页面与屏幕宽度不匹配（twitter bootstrap）

1 个答案: