Bootstrap Nav Bar链接边框

Question

我正在尝试在我的引导导航栏中的某个链接周围放置一个边框，以便它在此处看起来像这个图像。

我试图简单地在<li>元素周围放置边框，但Bootstrap导航栏<li>元素的边界上升到导航栏的顶部和底部，与图片不同。以下是我的努力：

我尝试使用的CSS只是一个简单的边框：

#nav-signup {
    border: 1px solid #ACOLOR;
}

我尝试在链接周围设置边距，但这会使链接与其他链接脱节。我也尝试在div中包装SIGN UP按钮，但这会使它丢失很多引导程序属性。

有没有简单的方法让我在SIGN UP链接周围放置这个边框而不必打击bootstrap？

由于

Answer 1

将文字换成跨度并为其添加边框谢谢。