Html <；李>；边框不包括其中的所有项目

我正在制作导航选项卡，当某个选项卡处于活动状态或“当前”状态时，我希望在该选项卡的底部显示边框，但边框仅包含图标而不包含文本

我的HTML

<li class="current"><a href="#tab-3"><img src="assets/related.svg" 
height="20px" width="20px">Related</a></li>

这就是我得到的

这是一把小提琴

我需要它看起来像这样

---

注意：在小提琴中，标签由于某种原因不起作用，但我认为这与此无关。谢谢。

您只需在末尾添加一个

a

。否则，它将忽略嵌套的

标记

.tabs-menu li.current a {

当我将它添加到您的代码示例中时，这将生成您正在查找的结果。
您需要做的就是在末尾添加一个
a
。否则，它将忽略嵌套的
标记

.tabs-menu li.current a {

当我将其添加到您的代码示例中时，这将生成您正在查找的结果。
您将
ul
和
li
的高度限制为30px，请将其删除。

变化如下：

.tabs菜单li{
高度：30px；您将
ul
和
li
的高度限制为30px，请将其移除。

变化如下：

.tabs菜单li{
高度：30px；那是因为你把高度限制在30px…@CBroe实际上修正了它lol…我没有看到那条线。你能把它作为一个答案，这样你就可以得到绿色的勾号=）谢谢。那是因为你把高度限制在30px…@CBroe实际上修正了它lol…我没有看到那条线。你能把它作为一个答案添加吗wer这样你就可以得到绿色的勾号=）谢谢。你能帮我理解jQuery的用途吗？这个问题似乎完全是基于风格的，而不是功能性的。@ehsan我不太确定这将如何解决这个问题，因为它会产生同样的结果。在小提琴上尝试过，但没有成功。然而正如@CBroe所建议的，是
高度
导致了这个问题。这个问题已经解决了。谢谢。@MarwanAK，我插入了fiddle演示。看到了。你能帮我理解jQuery需要什么吗？这个问题似乎完全是基于样式的，而不是功能性的。@ehsan我不确定如何解决这个问题，因为它会产生sa我的东西。在小提琴上试过了，没有用。但是正如@CBroe所建议的，是
高度引起的。问题已经解决了。谢谢。@MarwanAK，我插入了小提琴演示。看到了。这确实把线放在了文本下面是的，但线只会延伸到文本的长度，这看起来很奇怪。我需要把线延伸到文本下面查找
项的全宽，这确实会将行放在文本下方是的，但行只会延伸到文本的长度，这看起来很奇怪。我需要将行延伸到
项的全宽
.tabs-menu li {
    height: 30px;<---------------------Remove Or 50px
    //More codes......
}

.tabs-menu {
      height: 30px;<---------------------Remove Or 50px
      //More codes......
}