Bootstrap 导航栏链接边框

Question

我想在我的 bootstrap 导航栏中的一个 link 周围放置一个边框，使其看起来像这里的这张图片。

我想简单地在 <li> 元素周围放置一个边框，但是 Bootstrap 导航栏 <li> 元素的边界一直延伸到导航栏的最顶部和底部，与图片中的不同。这是我的努力的样子：

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

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

我尝试在 link 周围设置边距，但这会使 link 与其他的不一致。我还尝试将 SIGN UP 按钮包装在 div 中，但这会使它失去很多 bootstrap 属性。

有没有什么简单的方法可以让我在 SIGN UP link 周围设置这个边框，而不必打架 bootstrap？

谢谢

Answer 1

将文本换行并添加边框，谢谢。