Trouble with CSS in tables with Mozilla

[liunx]

Hi,

I have just written some simple rollover links in a table using CSS classes.

It views perfectly in IE but has added a couple of pixels on the top and
bottom of the row when you view it in Mozilla.

Please have a look at <!-- m --><a class="postlink" href="http://www.dovenetq.net.au/~gabrielle/">http://www.dovenetq.net.au/~gabrielle/</a><!-- m -->

The CSS for the links are:

.nav A:link {
background-color: #FFFFFF;
display: block;
padding: 5px 0px 0px 12px;
width: 214px;
height: 28px;
font:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#88898d;
text-decoration: none;
border-right: 1px solid #88898D;
}
.nav A:active {
background-color: #4d4d4d;
display: block;
padding: 5px 0px 0px 12px;
width: 214px;
height: 28px;
font:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color: #FFFFFF;
border-right: 1px solid #88898D;
text-decoration: none;
}
.nav A:visited {
background-color: #FFFFFF;
display: block;
padding: 5px 0px 0px 12px;
width: 214px;
height: 28px;
font:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#88898d;
text-decoration: none;
border-right: 1px solid #88898D;
}
.nav A:hover {
background-color: #4d4d4d;
display: block;
padding: 5px 0px 0px 12px;
width: 214px;
height: 28px;
font:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color: #FFFFFF;
border-right: 1px solid #88898D;
text-decoration: none;
}

If someone could help I would really appreciate it.

Thanks,
GabrielleIt probably has to do with the images not being display:block. You really should dump the table layout and do it right. Your design is a pretty simple CSS layout.Hi Ray,

I was asked not to use any images at all - hence the display:block to create the block of colour for the rollover. They require that the pages be customisable with the css.

Any other ideas?

Thanks,
Gabrielle