由于导航栏固定在顶部，面包屑没有出现答案

【问题标题】：breadcrumb not appearing due to the navbar fixed at top由于导航栏固定在顶部，面包屑没有出现
【发布时间】：2015-06-11 13:52:41
【问题描述】：

我在页面中定义了如下标记：

<div class="navbar navbar-default navbar-fixed-top">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>

        </button>   <a class="navbar-brand" href="#">Project name</a>

    </div>
    <div class="collapse navbar-collapse">
        <ul class="nav navbar-nav nav-pills">
            <li class="active"><a href="#">Home</a>
            </li>
            <li><a href="#">Companies</a>
            </li>
            <li><a href="#">Help</a>
            </li>
        </ul>
    </div>
</div>
<div class="row">
    <div class="col-md-4">
        <ul class="breadcrumb">
            <li><a href="#">Home</a>
            </li>
            <li><a href="#">About</a>
            </li>
            <li class="active"><a href="#">Help</a>
            </li>
        </ul>
    </div>
</div>

当页面呈现时，面包屑隐藏在导航栏后面。任何修复它的引导方法？或者这是一个错误？

Ps: jsFiddle : http://jsfiddle.net/KNsYt/2/

【问题讨论】：

老实说，我怀疑这是一个错误。我确实尝试在内容周围添加一个 class="container" ，但这没有任何区别。它必须是引导方式，还是您可以在面包屑 ul 中添加 class="pushdown"，在样式中添加 .pushdown {margin-top:50px}？
@yochannah 。显然，这不是错误。

标签： css breadcrumbs twitter-bootstrap-3

【解决方案1】：

bootstrap documents 本身明确定义如下：

需要身体填充

固定导航栏将覆盖您的其他内容，除非您在 .试试你自己的价值观或使用我们下面的 sn-p。提示：默认情况下，导航栏的高度为 50px。

因此，为主体提供 50 或更多像素的填充来解决问题。检查这个fiddle。

确保在核心 Bootstrap CSS 之后包含它。

body {
padding-top:60px
}

【讨论】：