时间戳

首页 > 解决方案 > 我的导航栏不是一直向左

html - 我的导航栏不是一直向左

问题描述

抱歉措辞奇怪，但无论如何，我创建了一个导航栏，它工作正常，但它稍微向右，即使我将它设置为一直向左。

截屏

< 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>

标签： htmlbootstrap-4

解决方案

尝试将宽度设置为 100%，将主体的边距设置为 0。

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

推荐阅读