引導4導航欄，不能刪除填充

Question

我想刪除菜單和導航欄邊距之間的填充。我似乎無法找到答案。

header nav #logo { 
 
    padding: -10px; }

<header> 
 
    <nav class="navbar navbar-expand-lg navbar-light bg-light" style="background-color: red;"> 
 
     <a class="navbar-brand" href="#"> 
 
      <img id="logo" src="images/logo.png" width="60" height="60"> 
 
     </a> 
 
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" 
 
       aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> 
 
      <span class="navbar-toggler-icon"></span> 
 
     </button> 
 
     <div class="collapse navbar-collapse" id="navbarSupportedContent"> 
 
      <ul class="navbar-nav mr-auto"> 
 
       <li class="nav-item active"> 
 
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> 
 
       </li> 
 
       <li class="nav-item"> 
 
        <a class="nav-link" href="#">Link</a> 
 
       </li> 
 
       <li class="nav-item"> 
 
        <a class="nav-link disabled" href="#">Disabled</a> 
 
       </li> 
 
      </ul> 
 
      <form class="form-inline my-2 my-lg-0"> 
 
       <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search"> 
 
       <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> 
 
      </form> 
 
     </div> 
 
    </nav> 
 
</header>

enter image description here

Answer 1

用bootstrap 4 spacing utilites for padding。

Decrease Padding Navbar Example

py-0套垂直（y軸）填充到0

<nav class="navbar navbar-dark py-0 bg-primary navbar-expand-lg"> 
    <a class="navbar-brand" href="#">Logo</a> 
    <div class="navbar-collapse collapse" id="navbarNav"> 
     <ul class="navbar-nav"> 
      <li class="nav-item py-0"><a href="#" class="nav-link">Link</a></li> 
     </ul> 
    </div> 
</nav>