Question

我正在使用bootstrap为UX构建一个rails应用程序。我需要帮助弄清楚如何防止容器类出现在导航栏下面。这就是页面的html：

<header class="navbar navbar-fixed-top navbar-inverse">
  <div class="navbar-inner">
    <div class="container">
      <span class="pull-right"> Title text goes here </span>
    </div>
  </div>
</header>


<div class="container">
    <%= yield %> <br / >
</div>

页面上唯一的CSS是来自bootstrap的CSS。

Answer 1

看看bootstrap样本，也许你需要为身体添加样式：

  body {
    padding-top: 40px;
  }

Answer 2

你需要在“navbar-inner”div中使用“容器”类的div的任何特殊原因吗？我建议将其改为“品牌”，放弃跨度，并将标题文本放在该品牌div中，如下所示：

<header class="navbar navbar-fixed-top navbar-inverse">
    <div class="navbar-inner">
        <div class="brand pull-right">Title text goes here </div>
    </div>
</header>

Bootstrap可以挑剔各种类的嵌套方式，你应该遵循文档中概述的相同结构：

http://twitter.github.io/bootstrap/components.html#navbar

如何使用bootstrap阻止容器出现在标题下

2 个答案: