右侧导航栏边距

Question

我正在尝试在bootstrap中创建一个Navbar，其中包含一个完整高度的标签，但我无法让它工作。

＆＃13;

＆＃13;

#su
{
    padding-top: 20px;
    padding-right: 40px;
    padding-bottom: 20px;
    padding-left: 40px;
    text-decoration: none;
    text-transform: uppercase;
    background-color: #ea3ace;
    color: snow;
}

＆＃13;

<ul class="nav navbar-nav navbar-right">
    <li><a href="#" id="su">test</a></li>
</ul>

＆＃13;

＆＃13;

＆＃13;

但在网站上，它显示如下： http://imgur.com/a/ZhyNK

如您所见，导航的顶部和右侧有边距。无论如何我都无法工作，如果你们能帮我一点，我真的很感激。

Answer 1

您可以简单地覆盖Bootstraps样式，例如margin-right: 0;类navbar-right，对选择器使用更高的特异性。

＆＃13;

＆＃13;

.nav.navbar-right {
  margin-right: 0;
}
#su {
  padding: 20px 40px;
  text-decoration: none;
  text-transform: uppercase;
  background-color: #ea3ace;
  color: snow;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<ul class="nav navbar-nav navbar-right">
  <li>
    <a href="#" id="su">test</a>
  </li>
</ul>

＆＃13;

＆＃13;

＆＃13;