CSS link style problem with "index.html" link

[thedevo]

I made my own CSS link style called "menu" (which is used in my menu bar)...

I want the links to change color when u roll-over them...

I made 3 instances of it (".menu a:link, .menu a:hover, .menu a:visited")

I appied the td class="menu" code to each cell with a word that I want to be a link...

Every link works perfect except "Home" which is designated as "index.html"
The "Home" link doesn't change color when you roll-over it like all the others.

I believe the problem lies with the word "index" in the link because I changes one of the other links to "index.html" and the roll-over color change stopped working.... what is going on?

here is the code:

<td width="760" height="25" valign="top"><div align="right">
<table width="589" border="0">
<tr>
<td class="menu" td width="102"><div align="right" class="style7"><a href="index.html">HOME</a></div></td>
<td class="menu" td width="103"><div align="right" class="style7"><a href="about.html">ABOUT</a></div></td>
<td class="menu" td width="129"><div align="right" class="style7"><a href="products.html">PRODUCTS</a></div></td>
<td class="menu" td width="113"><div align="right" class="style7"><a href="gallery.html">GALLERY</a></div></td>
<td class="menu" td width="120"><div align="right" class="style7"><a href="contact.html">CONTACT</a></div></td>
</tr>
</table>
</div></td>

[Shorts]

Index shouldn't change anything, is there an example page I could check out?