Question

对不起，我仍然创建了一个导航栏，该导航栏可以正常工作，但即使我将其设置为一直位于左侧，也可以正常工作。

Screenshot

< html>
<header>
<h1>Floor 3 </h1>
</header>
  <head>
    <link rel="stylesheet" href="css/bootstrap.css">
    <title> Locker Map</title>
  </head>
      <style>
  .navbar a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}
  .navbar {
  background-color: #000;
overflow: hidden;
}
.navbar a.active {
  background-color: #000000;
  color: white;
}
.navbar a:hover {
  background-color: #ddd;
  color: black;
}
  </style>

  <body>
    <div>
      <ul>
        <div class= "navbar">
        <a class="active" href="AtomWTHSlockerMAP.html">Home</a>
        <a href="floor1lockers.html">Floor 1 </a>
        <a href="floor2lockers.html">Floor 2 </a>
        <a href="floor3lockers.html">Floor 3 </a>
      </div>
      </ul>

      <p> </p>


  </body>
</html>

Answer 1

尝试将宽度设置为100％，将正文的边距设置为0。

    .body {
        width: 100%;
        margin: 0;
    }

Answer 2

无论如何，我删除了ul并修复了它

我的导航栏并非一直到左侧

2 个答案: