I'm having a weird issue with my Wayfinder menu in Firefox only (which is weird; that's normally my good browser). I use Firefox, Chrome, and IE for development testing. My website is
http://www.hugsandkissesretail.com. This is a very simple vertical navigation, and each item should be butted up next to each other, but there seems to be whitespace added above each li. Yes, I do have a reset.css attached to my template, and I've went through and manually added margin:0 and padding:0 to EVERYTHING in my sidebar. Here's the relevant HTML:
<div id="sidebar">
<div id="navigation">[[Wayfinder? &startId=`0` &outerTpl=`menuContainer` &outerClass=`navigation` &rowTpl=`menuRows`]]</div>
<img src="images/menubottom.png" alt="Hugs & Kisses" height="63" width="160" />
</div> <!-- end sidebar -->
And my CSS:
#sidebar {
float:left;
width:160px;
margin:0;
padding:0 0 10px 0;
}
#navigation {
width:160px;
margin:0;
padding:0;
text-align:left;
}
#navigation ul {
width:160px;
list-style:none;
margin:0;
padding:0;
}
#navigation ul li {
display:inline;
width:160px;
height: 25px;
margin:0;
padding:0;
}
#navigation ul li a {
text-align:left;
width:160px;
height: 25px;
display:inline-block;
margin:0;
padding:0;
font:13px Arial;
background: url("images/libg.png") no-repeat center;
}
#navigation ul li a:link {
margin:0;
padding:0;
text-decoration:none;
}
Any ideas?
