ciao a tutti, ho fatto questo piccolo dropdown menu http://www.nihills.net/provamenu.html
ma quando metto i bordi come vedete se andate con il mouse sopra il bordi delle celle inferiori risultano spostati di un pixel

ci sto giarando attorno da un po ma non riesco a farlo allienato


questo è il codice sorgente della pagina

codice:
<HTML>
<HEAD>
<TITLE>Dropdownmenu</TITLE>



<style type="text/css">

html{
	overflow-x: auto;
}

body{
	font-family: Verdana, Helvetica, Arial, Sans-Serif;
	font-size: 10px;
	margin: 0;
	padding: 0;
	color: #999999;
	background-color: #000000;
}

#menu{
	padding:0;
	maragin:0;
	width: 125px;
	border: 0px solid #00ffff;
}

#menu ul{
	padding:0;
	margin:0;
	border: 0px solid #666666;
}

#menu li{
	position: relative;
	float: left;
	list-style: none;
	margin: 0;
	padding:0;
	border: 0px solid #666666;
}

#menu li a{
	width:125px;
	height: 18px;
	display: block;
	text-decoration:none;
	text-align: left;
	font-weight:bold;
	line-height: 18px;
	background-color: #141414;
	color: white;
} 

#menu li a:hover{
	background-color: #aeaeae;
} 
#menu ul ul{
	position: absolute;
	top: 18px;
	width: 125px;
	visibility: hidden;
	border-left: 1px solid #666666;
	border-right: 1px solid #666666;
	border-bottom: 1px solid #666666;
}

#menu ul li:hover ul{
	visibility:visible;
}



</style>



</HEAD>
<BODY>
<div align="center">
 






<div id="menu">
	<ul>
		<li style="border: 1px solid #666666;">Link 1
			<ul>
				[*]Link 1-1
				[*]Link 1-2
				[*]Link 1-3
			[/list]
		
	[/list]
</div> 


</div>
</BODY>
</HTML>

grazie in anticipo a tutti