Question

我正在创建一个网页，我希望内容显示在左侧（9列），广告显示在右侧边栏（3列）。在左侧我嵌套了两行，并希望内容t0为显示在行内。但是，当我在实时服务器上进行测试时，广告无法正常显示。我正在使用Bootstrap 3对页面进行分区。

<!--Parent row -->
<div class="row">  

    <div class='row'>
        <div class="col-sm-9">
             //Page content.....
        </div>
    </div>

    <div class='row'>
        <div class="col-sm-9">
             //Page content.....
        </div>
    </div>

    <div class="row">
        <div class="col-sm-9">
             //...Google Ads display
        </div>
    </div>

</div> <!--END parent row -->

Answer 1

使用Bootstrap，所有列必须加起来为12.我可以看到你有3组9列，这些列为18。

布局必须如此：

<!--Parent row -->
<div class="row">
    <div class="col-sm-9">
        <div class="col-sm-6"><!-- Nested col 1 (of 50%) --></div>
        <div class="col-sm-6"><!-- Nested col 2 (of 50%) --></div>
    </div>
    <div class="col-sm-3"><!-- ...Google Ads display --></div>
</div> <!--END parent row -->

这会将Google广告列放在右侧，并在页面内容列中包含两个嵌套列。

.row类应该每行只使用一次，而不是每列。

Twitter Bootstrap 3 SideBar通知无法正常显示

1 个答案: