Forum Moderators: not2easy
I'm newbie in CSS, and during my exercises I faced a problem with 'hover' pseudo-class selector, I assign this selector to tag <TD>, and it work fine in Mozilla Firefox and Opera, but not in IE6. Please give me a little help here. Here is the example:
<HTML>
<HEAD>
<TITLE>Menu With CSS</TITLE>
<STYLE TYPE="text/css">
<!--
td.nav a {
font-family: Arial;
font-size: 10px;
padding-left: 3px;
color: blue;
display: block;
width: 100%;
padding-top: 3px;
padding-bottom: 3px;
text-decoration: none;
}
td.nav a:hover {
color: yellow;
text-decoration: underline;
}
td.nav {
border: 1px solid blue;
}
td.nav:hover {
background: blue;
}
-->
</STYLE>
</HEAD>
<BODY bgproperties="fixed" background="blue">
<P font-family=Arial font-size="10px" color=black margin-top=0 margin-bottom=0 style="margin-top: 0; margin-bottom: 0">
<b><font face="Arial" size="2">Menu With CSS</font></b>
</P>
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="blue" width="22%">
<tr>
<td class="nav"><a href="http://www.google.com">Google</a></td>
</tr>
<tr>
<td class="nav"><a href="http://www.yahoo.com">Yahoo</a></td>
</tr>
<tr>
<td class="nav"><a href="http://www.microsoft.com">Microsoft</a></td>
</tr>
</table>
</BODY>
</HTML>
Note:
When I browse this html file with Mozilla or Opera, the table cell background color will become blue when I move my mouse over the cell, but in IE6, nothing happened when I mouse my mouse over the cell. Any idea what is going on? Thanks for your help...
Regards,
Bobby
cEM
Bye :)
Regards,
Bobby
