如何避免無序列表項上下的小分隔線？

Question

我正在使用twitter bootstrap爲了有一個像列表一樣的選擇選項。

如何避免上面的小分隔線（如圖所示）和列表項下方？見screeshot：

在下面看到的代碼。這將是最簡單的辦法看看的jsfiddle：

https://jsfiddle.net/qqnkc9u3/3/

HTML：

<div class="dropdown"> 
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
    D2ropdown 
</button> 
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
    <li><a class="my2" href="#"><!--data-value="action"--> Action</a></li> 
    <li><a class="my2" href="#" data-value="another action">Another action</a></li> 
    <li><a class="my2" href="#" data-value="something else here">Something else here</a></li> 
    <li><a class="my2" href="#" data-value="separated link">Separated link</a></li> 
</ul> 

JS：

$(".dropdown-menu li a").click(function(){ 
$(this).parents(".dropdown").find('.btn').html($(this).text() + ' <span ></span>'); 
$(this).parents(".dropdown").find('.btn').val($(this).data('value')); 
}); 

CSS：

@charset "UTF-8"; 

@import url('https://fonts.googleapis.com/css?family=PT+Sans'); 

#dropdownMenu1 { 
/*text-indent: -150px;*/ 
-webkit-appearance: none; 
-moz-appearance: none; 

font-family: 'PT Sans', sans-serif; 
/*font-style: italic;*/ 
color: red; 
font-size: 18px; 
text-align: left; 

width: 242px; 
height: 42px; 
border: 4px; 
/*background-color: #e7eaf3;*/ 
background: url("http://www.adelepham.com/deepthoughts/gray-pattern.jpg") no-repeat 0 0; 
/*color: #5B629B;*/ 
/*padding: 4px;*/ 
} 

.my2 { 
text-indent: -7px; 
-moz-border-radius: 3px; 
-webkit-border-radius: 3px; 
border-radius: 3px; 

font-style: italic; 
font-family: 'PT Sans', sans-serif; 
color: red; 
font-size: 18px; 

-webkit-appearance: none; 
-moz-appearance: none; 
width: 242px; 
height: 42px; 
/*border: 4px;*/ 
/*color: #5B629B;*/ 
background: url("http://www.adelepham.com/deepthoughts/gray-pattern.jpg") no-repeat 0 0; 
} 

Answer 1

剛剛擺脫填充（updated JSFiddle）的：

.dropdown-menu { 
    padding: 0; 
} 

你也可以做this：

.dropdown-menu { 
    padding: 0; 
    margin: 0; 
} 

擺脫按鈕和之間的小1個或2個像素的空間菜單本身。

Answer 2

將padding: 0; margin: 0;添加到您的#dropdown-menu。

jsFiddle

Answer 3

您可以嘗試像去除UL的padding和margin：

.dropdown-menu { 
    padding: 0px; 
margin: 0px; 

}

小提琴：https://jsfiddle.net/qqnkc9u3/8/