How To Create Menu Rollover ...

How to create the same rollover effect using tables instead of lists. First we create the links, Each link is contained in a table cell,Like this code:

<div class="menu">
<table summary="" cellpadding="1" cellspacing="1" class="menu">
<tr>
<td><a href="#" onfocus="this.blur()"> Link 1</a></td>
</tr>
<tr>
<td><a href="#" onfocus="this.blur()"> Link 2</a></td>
</tr>
<tr>
<td><a href="#" onfocus="this.blur()"> Link 3</a></td>
</tr>
<tr>
<td><a href="#" onfocus="this.blur()"> Link 4</a></td>
</tr>
<tr>
<td><a href="#" onfocus="this.blur()"> Link 5</a></td>
</tr>
</table>
</div>

Now we specify styles for these to add the table (.menu):
table.menu a {
width:125px;
border:1px solid #333333;
display: block;
}

The outer div "div.menu a" is where we specify our base styles and it also acts as a workaround for crappy NS4x which does not like borders on links. Told you we need it!

div.menu a {
color: #333333;
background: #ffffff;
text-decoration:none;
font-size:11px;
line-height:16px;
font-family: Tahoma, verdana, sans-serif;
padding: 2px 5px;
}

Then we will add the link colours:

div.menu a:link {
color: #333333;
background: #cccc99;
}

div.menu a:active {
color: #000000;
background: #cccc99;
}

div.menu a:visited {
color: #333333;
background: #cccc99;
}

div.menu a:hover {
color: #eeeeee;
background: #333333;
border:1px solid #000000;
}

 Original Source:
http://www.ssi-developer.net/css/menu-rollover-effect_table.shtml