項目間の間隔を削減 - 複数選択ドロップダウン

Question

私は角度4.

に複数選択ドロップダウンを作成するためにhttps://github.com/softsimon/angular-2-dropdown-multiselectを使用しています私は、ドロップダウンメニューに表示される項目のパディングを変更したいと思います。開発ツールから、私がパディングを取り除くためのアイテムにカスタムCSSを適用することができます方法はありパディングが

.dropdown-menu>li>a { 
    display: block; 
    padding: 3px 20px; 
    clear: both; 
    font-weight: 400; 
    line-height: 1.42857143; 
    color: #333; 
    white-space: nowrap; 
} 

を3pxと20ピクセル

に設定されているようです。私はオーバーライドする場合は「ドロップダウン・メニュー>李>」私のCSSで、それは他の要素にも

領域が黒で強調表示

.dropdown-menu>li>a { 
    display: block; 
    padding: 1px 5px; 
    clear: both; 
    font-weight: 400; 
    line-height: 1.42857143; 
    color: #333; 
    white-space: nowrap; 
} 

に影響を与える可能性があることは私が取得したいと思いホワイトスペースです捨てる。

Answer 1

スタイルをオーバーライドする必要がありますが、そのクラス内でのみ適用されるように別のクラスにラップするようにしてください。例えば

： HTML：

<div class="customDropdown"> 
//Use drop down here 
</div> 

CSS：

.customDropdown .dropdown-menu>li>a { 
     display: block; 
     padding: 1px 5px; 
     clear: both; 
     font-weight: 400; 
     line-height: 1.42857143; 
     color: #333; 
     white-space: nowrap; 
    }