problema com menu CSS

seguinte... o menu ta perfeito e é bem como eu preciso.. o problema é que as vezes quandonavego em outros links(sem ser do menu)(no firefox), DO NADA surgem novas linhas no menu, ja vasculhei o codigo e ateh onde eu sei nao tenho a minima idea do que pode estar acontecendo.......

nesse menu, as celulas mudam de cor ao passar o mouse, mas quando ele cria essas linhas, o link que esta entre elas nao muda de cor, mas elas mudam....

seguem screenshots de como ele fica

http://www.subsoloart.com/ERRONOMENU.JPG

http://www.subsoloart.com/ERRONOMENU2.JPG

http://www.subsoloart.com/ERRONOMENU3.JPG

deu pra entender?

segue o codigo css e o jeito q estou montando o menu(com php)

do { ?>
	<ul id="menu"><li><a href="loja-produtos.php?cod_cat=<?php echo $row_Recordset1['cod_cat'];?>">
	<p>   <? echo $row_Recordset1['nome_cat']; ?></p>
	<span><p><? echo $row_Recordset1['desc_cat']; ?></p></span></a></li></ul>

<?

ul#menu {

	padding:0;
	position: relative;
	left:0px;
	margin: 0px;
	width: 110px;
	list-style:none;
}

ul#menu li{

	position: relative;
	padding:0;
	left:0px;
	margin: 0px;
}

ul#menu a {

	width: 110px;
	display: block;
	text-align:left;
	padding: 2px;
	margin-bottom:1px;
	text-decoration: none;
	color: #000;
	background: #E9E9E9;
	border-left: 7px solid #999;
	voice-family: "\"}\"";
	voice-family:inherit;
}

>#pagebody>ul#menu a { width:110px; }
* html ul#menu li { float: left; height: 1%; }
* html ul#menu li a { height: 1%; }
ul#menu a:hover {

	color: #fff;
	background: #65adff;
	border-left: 7px solid #009;
}

ul#menu a span { display: none; }
ul#menu a:hover span {

	display: block;
	position: absolute;
	top:0;
	left: 124px;
	width: 110px;
	padding: 5px;
	color: #000;
	background: #FFF;
	text-align: justify;
	border:1px solid #000;
}

alguem sabe pq isso acontece?