如何设置填充以延伸到父容器的顶部和底部边缘？

Question

如何设置填充以延伸到父容器的顶部和底部边缘？例如，在这个 case 中，我如何设置填充以使底部填充恰好在导航栏结束的位置结束（与显示的不同，它在哪里超过）？这将确保对应于 link 的整个区域是可点击的，但它不会超出导航栏的底部。

nav {
  background: rgb(255, 99, 71);
  height: 50px;
}

a {
  padding-bottom: 35px;
  background-color: rgb(0, 128, 128);
}

<nav>
  <a href="#">Hello</a>
  <a href="#">About</a>
</nav>

Answer 1

有很多方法可以做到这一点，但一种方法是根本不设置填充。像下面这样的东西会起作用：

a {
    display: inline-flex;
    line-height: 50px;
    background-color: rgb(0, 128, 128);
}

同样，有很多方法可以实现您想要的，但这只是一种方法。

How can I set the padding to extend till the top and bottom edges of the parent container?