Date: 11/22/05 (Web Development)    Keywords: css

Oh how I love IE and Mozilla, I am trying to clean up a template design from a client. They have a lovely (bloated) roll over menu with images. I want to move to css, so I knock out a menu. Now I have a spacing issue that just rocks. Image of the problem + css after the cut (mangled since I still cant get pre to work right)

Mozilla 1.7.8 on the left, IE 6 on the right

#navcontainer { 
width: 158px;
background-color:#253E82; 
text-align:center;
}

#navcontainer ul
{
margin-left: 0;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#navcontainer a
{
display: block;
padding: 3px;
width: 130;
background-color: #E5E5E5;
text-decoration: none;
color: #fffff;
/* border-bottom: 1px solid #eee; */
text-align:center;
}

#navcontainer a:link, .navlist a:link, .navlist a:visit
{
color: #ffff;
text-decoration: none;
}

#navcontainer a:hover
{
background-color: #369;
color: #fff;
}

{div id="navcontainer"}
{ul id="navlist"}
	{li a href="#" title="About Us" About UsLa PosadaThe StorytellerVolunteersMedicare BenefitGrief ServicesPrivacy Practices

Am I just hosed or are there hacks I can use?

Source: http://www.livejournal.com/community/webdev/272766.html