Навбар имеет границу вокруг него и не может быть удален

Я пытаюсь создать панель навигации для моего сайта, и происходит нечто странное. Это рамка вокруг навигационной панели, и я не могу ее удалить? Я пытался найти ошибку, но ничего не работает. Я попытался установить границу в 0px в теге style, но не сработал, граница все еще там, как? Пожалуйста, помогите мне и спасибо заранее

код здесь:

<!DOCTYPE html>
<html>
<head>
<style>
#nav {
  overflow: hidden;
  background-color: #282e30;
  border: 0px;
}

#nav a {
  float: left;
  color: #fff;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  border: 0px;
}

#nav a.active {
    background-color: #286a82;
    color: white;
    border: 0px;
}
</style>
</head>
<body>

<div id="nav">
  <a class="active" href="/home.html">Home</a>
  <a href="/contact.html">Contact us!</a>
  <a href="/about.html">About!</a>
</div>

</body>
</html>

1 ответ

Решение

Вам не нужно border: 0px; в вашем коде это не граница вокруг панели навигации, а поле для элемента body в вашем HTML. По умолчанию <body> у тега есть небольшое поле, поэтому он выглядит так, как будто у вас есть граница. Попробуйте добавить body{margin:0px;} в вашем коде, и это должно работать. Как это:

<style>
body {
  margin: 0px;
}
#nav {
  overflow: hidden;
  background-color: #282e30;
}

#nav a {
  float: left;
  color: #fff;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

#nav a.active {
    background-color: #286a82;
    color: white;
}
</style>
Другие вопросы по тегам