导航栏不会停留在页面顶部的水平线上

时间:2015-11-21 06:31:03

标签: css twitter-bootstrap

我知道在类似主题上已经有很多问题,但我尝试了内联块和各种引导程序导航栏类,以便让我的导航栏中的按钮保持水平线。

<header class= "navbar navbar-inverse">
<div class= "container navbar-header">
  <div> <%= link_to "ZBLOG", "#", class: "btn btn-lg btn-primary pull-left", id: "logo" %></div>
  <ul class= "">
    <li><%= link_to "Home", "#", class: "btn-lg btn-primary navbutton" %>></li>
    <li><%= link_to "Articles", "#", class: "btn-lg btn-primary navbutton" %>></li>
    <li><%= link_to "Contact Me", "#", class: "btn-lg btn-primary navbutton" %>></li>
    <li><%= link_to "Button", "#", class: "btn-lg btn-primary navbutton" %>></li>
  </ul>
</div>

看起来这应该只是将这些按钮放在顶部,就像你期望的那样。相反,他们因为某种原因(例如Buttons)而踩到台阶。无论如何,任何帮助都会很棒。多谢你们。

1 个答案:

答案 0 :(得分:0)

试过这个...... ??

<nav class="navbar navbar-default">
    <div class="container">
        <ul class="nav navbar-nav">
           <li>
                <p class="navbar-btn">
                    <a href="#" class="btn btn-default">I'm a link button!</a>
                </p>
            </li>
            <li>
                <button class="btn btn-default navbar-btn" type="button">I'm a form button!</button>
            </li>
        </ul>
    </div>
</nav>

希望这会有所帮助......