Когда я пытаюсь нажать или навести метку привязки, она реагирует только на некоторые части

#html #css #hover #uinavigationbar #anchor

Вопрос:

У меня есть 3 якорных тега в моей навигации, и они работают, только если я нажимаю на верхнюю часть тега, а иногда даже это не работает.

 nav {
  grid-area: nav;
  text-align: end;
  background-color: white;
  position: fixed;
  width: 100%;
  top: 0;
  padding: 2rem;
}

nav a {
  margin-right: 4rem;
  padding: 1rem;
  text-decoration: none;
  color: white;
  font-style: normal;
  font-weight: bold;
  font-family: 'Lato', sans-serif;
  font-family: 'Open Sans', sans-serif;
  font-size: 1.2em;
  border-radius: 45px;
  background-color: #212529;
}

.active {
  background-color: #383f45;
}

nav a:hover {
  background-color: #6C757D;
} 
 <nav>
  <a href="/index.html" class="active">Home</a>
  <a href="/html/about.html">About Me</a>
  <a href="/html/contact.html">Contact</a>

</nav> 

Ответ №1:

Возможно, вам потребуется очистить кэш-память вашего браузера. Когда я запустил код, не было никаких проблем с щелчком по тегам привязки.

Кэширование браузера

Как удалить кэш-память

Ответ №2:

Проблема была в z-индексе. Когда я дал z-индекс: 1, все работало нормально.