Rahmen von Listenelementen überlappen lassen

[Klaus]

Hey, bei Tabllen gibt's das schöne border-colapse:colapse
Leider scheint das bei <li>-Elementen nicht zu funktionieren. Wie kann ich erreichen, dass sich die Ränder meiner horizontalen Liste überlagern, und ich den Code schön kurz halten kann:
Hier meine aktuelle (unschöne) Lösung:

ul#Navigation {  
	width:957px;  
	margin-left:auto;  
	margin-right:auto;  
	margin-top:0px;  
	padding:0px;  
	text-align:center;  
	background-color: #828fc6;  
	list-style: none;  
}  
ul#Navigation li {  
	float:left;  
    border: solid #FFF;  
}  
ul#Navigation li.zelle1 {  
    width:227px;  
	border-width: 2px 1px 2px 2px;  
}  
ul#Navigation li.zelle2 {  
    width:240px;  
	border-width: 2px 1px 2px 1px;  
}  
ul#Navigation li.zelle3 {  
    width:240px;  
	border-width: 2px 2px 2px 1px;  
}

Man sieht, dass ich insgesamt drei verschiedene Rahmen definieren musste.
Viele Grüße
Klaus