Strange MSIE box model 1

[Nevermoor]

I haven't really had to screw around with IE box model hacks before, but I've got a fairly annoying problem (that could perhaps also be solved with cleaner markup -- ideas?)

The site is

http://pantheon.yale.edu/~fhb5/Rugby/index.shtml

and the problem is in the 1 pixel margins between menu options and the solid grey bars. On firefox, they are all 1 pixel, on MSIE the bottom grey bars are 3 pixels off and the top one is 2 pixels off. Not a huge problem, but annoying.

Current coding for a menu section is:

<ul>
<li><span>&nbsp;</span></li>
<li><a href="TARGET">TEXT</a></li>
<li><a href="TARGET">TEXT</a></li>
<li><a href="TARGET">TEXT</a></li>
<li><span>&nbsp;</span></li>
</ul>

with this long bit of CSS from something i found through a list apart

#navlist span
{
	background-color: #808080;
	text-align: left;
	width: 160px;
	display: block;
	font-size: 10px;
}
#navlist ul
{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#navlist li { 
	margin: 0 0 1px 0; 
}
#navlist a
{
	text-align: left;
	border-left: 10px solid #808080;
	border-right: 10px solid #808080;
	padding: 5px 10px;
	width: 120px;
	display: block;
}
#navlist a:link, #navlist a:visited
{
	color: #fff;
	background-color: #002569;
	text-decoration: none;
}
#navlist a:hover, #navlist a:active
{
	color: #fff;
	background-color: #2586d7;
	text-decoration: none;
	border-top: none;
	border-bottom: none;
}
#navlist ul
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-family: verdana, arial, Helvetica, sans-serif;
}

 

[Vragabond]

Not really an intelligent looking solution, but it does work for me in Mozilla and IE6. Change the font size for span.

#navlist span
{
    background-color: #808080;
    text-align: left;
    width: 160px;
    display: block;
    [b][COLOR=blue]font-size: 13px;[/color][/b]
}

 

[Halcrow]

what about putting in:

#navlist {
   border-collapse: collapse;
   }

not tried it on your site, but that usually takes away any default borders between elements.

 

[Nevermoor]

Vragabond: Thanks, having the border too wide is def. better than having mis-sized spaces. Frustrating though that IE's problems force a perfectly good Mozilla site to display wrong.

Halcrow: border-collapse didn't do it for me this time, but I def. should have tried it before posting as it does frequently help.