Bootstrap 导航栏链接边框

Question

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

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

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

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

我尝试在链接周围设置边距，但这会使链接与其他链接脱节。我还尝试将 SIGN UP 按钮包装在一个 div 中，但这会导致它失去很多引导属性。

我有什么简单的方法可以在 SIGN UP 链接周围放置此边框，而无需与引导程序作斗争？

谢谢

Answer 1

将文本包装在 span 中并为其添加边框，谢谢。