引导按钮大小而不更改导航栏的大小

Question

我想在导航栏上放置登录按钮，但是只要我将其放在导航栏上，导航栏的大小就会增加。如何阻止导航栏更改大小并更改按钮的大小？

<div class="navbar-primary">
  <nav class="navbar navbar-default navbar-static-top">
  <div class="container-fluid">
<ul class="nav navbar-nav navbar-right">

        <li><a href="/accounts/signin/">login</a></li>
        </ul>

在这里，我想用bootstrap按钮替换login这个词，我试过放<button class="btn btn-primary" type="submit">Sign in</button>  内部但导航栏大小因按钮的大小而改变

编辑：

register

        

login

Answer 1

好的，这是一个简单的解决方案，只需添加此选择器和样式

.btn-sm {
padding-top: 0px;
padding-bottom: 0px;
}

这是指向具有确切代码的codepen的链接，除了我提供的样式

Example

您可以添加和删除样式以查看差异。

如果您希望导航栏更大一点，只需相应地添加到填充顶部和填充底部。