Hi !
Aqui estaba el problema:
Código HTML:
#navigation{
height:27px;
width: 800px;
line-height:27px;
margin:-8px 10px 10px 0px;
_margin:-8px 10px 10px 0px;
background: $menubgcolor;
}
#navigation ul{
list-style-type:none;
padding:0;
margin:0;
}
#navigation li{
float:left;
border-right:1px solid #888888;
white-space:nowrap;
}
#navigation li a{
display:block;
padding:0 10px;
font-size:0.825em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}
* html #navigation a {width:1%;}
#navigation .selected,#navigation a:hover{
background:$menuhoverbgcolor ;
color:#000000;
text-decoration:none;
}
Si te fijas te daras cuenta que los "LIs" tienen Padding y Margin propio, se los eliminas, y luego a cada uno le aplicas por ejemplo un padding (como ya lo estabas haciendo)
Espero te sea util!
-ByE-