如何從引導列中刪除填充和邊距？

Question

我想刪除引導列中的填充和邊距，以添加問題中提到的noPadding類，但是它沒有從col-md-3和col-md-6之間刪除邊距和填充按鈕的提交按鈕，任何想法？

main.html中

<div class="col-md-8 col-md-offset-2"> 
    <form role="form"> 
     <!--<div class="form-group">--> 
     <div class="col-md-3 nopaddingPanel"> 
      <label>Search Server</label> 
     </div> 
     <div class="col-md-6 nopaddingPanel"> 
      <!-- <form name="searchForm" class="form" ng-submit="submit()"> --> 
      <div ng-class="{ 'has-error': searchForm.searchName.$invalid || searchForm.searchId.$invalid }"> 
       <input name="searchName" class="form-control" ng-model="vm.search" type="text" id="searchName" placeholder="Search" required> 
      </div> 
     </div> 
     <div class="col-md-3"> 
      <button type="submit" class="btn btn-success" ng-click="searchServerFile()">Search</button> 
     </div> 
     <!-- </form> --> 
     <!--</div>--> 
    </form> 
</div> 

的main.css

.nopaddingPanel { 
    padding: 0 !important; 
    margin: 0 !important; 
} 

Answer 1

你需要做一個CSS選擇器是more specific大於自舉的，那麼你可以只使用padding: 0或padding: unset。

儘可能避免使用!important。它造成了比解決更多的麻煩。見When Using Important is the Right Choice

例如，下面應該工作：

.col-md-3.nopaddingPanel { 
    padding: 0; 
    margin: 0; 
} 

注意，這個選擇是更具體的...它使用了兩個類的名字，而不是一個，這意味着它將戰勝引導的（使用在其選擇器中只有一個類名）。