如何修复不起作用的图像链接？

Question

我正在尝试为我的页面导航栏获取图片以链接回我网站的主页。我尝试使用下面的代码，但由于某种原因，只有图像的顶部是可点击的。我已经检查过它并尝试了很长时间，但我找不到任何看起来不合适或语法不正确的东西。

有什么办法可以解决这个问题吗？

nav {
  height: 85px;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  background: none;
  padding-left: 60px;
  padding-right: 60px;
  user-select: none;
  transition: 0.5s ease-in-out;
  z-index: 100;
}

nav img {
  height: 70px;
  margin-top: 5px;
}

nav a:hover {
  color: var(--primary) !important;
  transition: 0.15s;
}

nav img {
  margin: 0px;
}

nav .responsive-nav {
  display: none;
}

nav .right {
  position: fixed;
  top: 27px;
  right: 60px;
  width: 100%;
  text-align: right;
  height: 85px;
  text-transform: uppercase;
}

nav .right ul {
  position: fixed;
  top: 27px;
  right: 60px;
  width: 100%;
  height: 85px;
  margin-top: 0px;
}

nav .right li {
  margin-top: 7px;
}

nav .right a {
  text-decoration: none;
  color: #ffffff;
  font-size: 16px;
  margin-left: 20px;
}

nav h1 a {
  text-decoration: none;
  color: #ffffff;
  transition: 0.15s;
}

nav h1 a:hover {
  color: var(--primary);
  transition: 0.15s;
}

nav .menu {
  display: none;
  position: fixed;
  top: 18px;
  right: 30px;
  font-size: 25px;
  border: 2px solid var(--primary);
  border-radius: 5px;
  padding: 5px;
  color: var(--primary);
  cursor: pointer;
}

<nav>
    <a href="/"><img src="https://www.gsr-technology.co.uk/wp-content/uploads/2015/10/partner-logo-placeholder.jpg" /></a>
    <div class="right">
      <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/services.html">Services</a></li>
      </ul>
    </div>
    <i class="fas fa-bars menu"></i>
  </nav>

Answer 1

在上面的代码中nav .right 和nav .right ul 都有宽度：100%；删除它并尝试它会完成，整个图像将是可点击的。