Html WordPress4.3&;Bootstrap 3.x-为什么我的容器重叠?

Html WordPress4.3&;Bootstrap 3.x-为什么我的容器重叠?,html,css,twitter-bootstrap-3,wordpress-theming,Html,Css,Twitter Bootstrap 3,Wordpress Theming,我正在Wordpress中开发一个包含引导功能的主题。不知什么原因,我的导航栏与页面顶部的文本重叠。这就像导航栏在网页上悬停一样 我尝试添加“行”并指定12个宽度,但这似乎不起作用 以下是导航栏的HTML: <!-- NAVIGATION ==================================================================== --> <div class="navbar-wrapper"> <nav cla

我正在Wordpress中开发一个包含引导功能的主题。不知什么原因,我的导航栏与页面顶部的文本重叠。这就像导航栏在网页上悬停一样

我尝试添加“行”并指定12个宽度,但这似乎不起作用

以下是导航栏的HTML:

<!-- NAVIGATION
==================================================================== -->

<div class="navbar-wrapper">
    <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">  
      <div class="container">

          <!-- left side of navbar -->
          <div class="navbar-header">
              <button type="button" class="navbar-toggle" data-
                  toggle="collapse" data-target=".navbar-collapse" aria-expanded="false">
                  <span class="sr-only">Toggle navigation</span>
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
              </button>
              <a class="navbar-brand" href="/">BRAND</a>
          </div> <!-- end navbar-header -->

          <!-- right side of navbar -->
          <div class="navbar-collapse collapse">
              <ul class="nav navbar-nav navbar-right">
                  <li id="menu-item-216" class="menu-item menu-item-type-
post_type menu-item-object-page menu-item-home menu-item-216"><a 
href="http://www.example.com/">Home</a></li>
<li id="menu-item-205" class="menu-item menu-item-type-post_type menu-item-
object-page current-menu-item page_item page-item-203 current_page_item 
menu-item-205"><a href="http://www.example.com/about-us/">About Us</a></li>
<li id="menu-item-219" class="menu-item menu-item-type-post_type menu-item-
object-page menu-item-219"><a href="http://www.example.com/faq/">FAQ</a>
</li>
<li id="menu-item-239" class="menu-item menu-item-type-post_type menu-item-
object-page menu-item-239"><a href="http://www.example.com/blog/">Blog</a>
</li>
              </ul>
          </div>
      </div> <!-- end of container -->
    </nav> <!-- end of navbar -->
</div> <!-- end of navbar-wrapper -->

切换导航
页面的下一部分如下所示。上面的导航栏实际上与“关于我们”重叠


关于我们
这里有一堆文字


非常感谢您的帮助。

我想我已经修好了。我想把导航栏固定在顶部。为了解决上述问题,我在css中添加了以下内容:

body {
    margin-top: 50px;
}

我相信我已经修好了。我想把导航栏固定在顶部。为了解决上述问题,我在css中添加了以下内容:

body {
    margin-top: 50px;
}