导航栏未扩展到页面的整个宽度

时间:2019-03-19 06:29:53

标签: html css django

snapshot

如果向右滚动页面,导航栏不会扩展。我已使用此页面上的引导导航栏。 (查看来源:https://getbootstrap.com/docs/4.0/examples/navbars/)(second导航)。我正在使用bootstrap.min.css。我已经为这个问题浏览了StackOverflow。一些帖子建议使用

width: 100%;
 height: 150px;
 margin: 0px auto;
 position: relative;

将解决此问题。但是我在bootstrap.min.css中找不到相同的内容。另外,在bootstrap.css中更改相同内容也不起作用。请指导我解决此问题。 HTML文件:

!DOCTYPE html>
<html>
  <head>
    <title>Inventory</title>
  </head>
  {% load static %}
  <link rel="stylesheet" href="{% static '/css/bootstrap.min.css '%}">
  <link rel="stylesheet" href="{% static '/css/button.css '%}">
  <body>
    <nav class="navbar navbar-expand navbar-dark bg-dark">
     <a class="navbar-brand" href="#">xxxxxxxxx - xxxxx</a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample02" aria-controls="navbarsExample02" aria-expanded="true" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
     </button>

     <div class="collapse navbar-collapse" id="navbarsExample02">
       <ul class="navbar-nav mr-auto">
         <li class="nav-item active">
           <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
         </li>
         <li class="nav-item">
           <form method="POST" action="/logout/">
             {% csrf_token %}
             <!-- <a class="nav-link" href="{% url 'logout' %}">Logout</a> -->
             <input class="nav-link" id="button" type="submit" value="Logout" style="float: right">
           </form>
           <!-- <a class="nav-link" href="{% url 'login' %}">Logout</a> -->
        </li>
       </ul>
    </div>
   </nav>
   <div class="container">
     {% block body %}

     {% endblock %}
  </body>
</html>


Tha

nks

0 个答案:

没有答案