CSS懷疑 - 邊界左邊框底部

Question

我正在開發一個界面css，並且遇到了以下問題：當我將左邊框的大小設置的比其他大時，它不會與底邊相重疊...我拍了一個很好的鏡頭，但沒有看到像這樣的東西......有人可以幫助我嗎？跟隨文件jsFiddle

在這種情況下，邊緣的下邊緣與左邊的綠色重疊！

http://jsfiddle.net/Igaojsfiddle/T6KrE/24/

#contactList > li { 
font-weight: bold; 
color: #fff; 
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); 
background-image: -webkit-linear-gradient(#ededed, #eff0f2); 
background-image: -moz-linear-gradient(#ededed, #eff0f2); 
background-image: -ms-linear-gradient(#ededed, #eff0f2); 
background-image: linear-gradient(#ededed, #eff0f2); 
border-bottom:1px solid #999999; 
border-left:10px solid green; 
border-right:1px solid #999999; 
height:55px; 

}

期待接受救助，擁抱。

Answer 1

你必須把邊境的UI元素，而不是li元素上;）

#contactList { 
margin: 0; 
padding: 0; 
list-style-type: none; 
border-left: 10px solid green; 
-webkit-border-bottom-left-radius: 5px; 
-webkit-border-bottom-right-radius: 5px; 
-moz-border-radius-bottomleft: 5px; 
-moz-border-radius-bottomright: 5px; 
border-bottom-left-radius: 5px; 
border-bottom-right-radius: 5px; 
}