Question

我有这个twitter bootstrap的标记

<!DOCTYPE html>
<html>
<head>
    <title>Modus - Clientportal</title>

        <link rel="stylesheet" href="/packages/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="/css/main.min.css">


</head>
<body>

    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <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="#">Modus - Clientportal</a>
          <p class="navbar-text">You are logged in as Sebastian</p>
        </div>
        <div class="navbar-collapse collapse">d
            <div class="navbar-right">
              <ul class="nav navbar-nav ">
                <li><a href="/dashboard">Dashboard</a></li>
                <li><a href="/settings">Settings</a></li>
                <li><a href="/profile">Profile</a></li>
                <li><a href="/help">Help</a></li>
              </ul>
              <a class="btn btn-default navbar-btn" href="/logout">Logout</a>
            </div>
        </div>
      </div>
    </div>

    <div class="container-fluid">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">profile.title</h3>
            </div>
            <div class="panel-body">
                <form method="POST" action="/profile" accept-charset="UTF-8">


                    <div class="form-group">
                        <label for="exampleInputPassword1">Password</label>
                        <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputPasswordConfirmation1">Password Confirmation</label>
                        <input type="password" class="form-control" id="exampleInputPasswordConfirmation1" placeholder="Password">
                    </div>
                    <input class="btn btn-primary" type="submit" value="profile.btn.save">              

                </form>         

            </div>
        </div>
    </div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="/packages/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>

如果我加载它，固定导航栏会断开并失去它的高度。

我发现的唯一解决方案是将密码字段的类型更改为其他任何内容，但由于我需要密码字段，因此无法解决该问题。

有什么建议吗？

Bootstrap固定导航栏中断了密码字段

0 个答案: