Below is the cut down version of my html code of my page, as the full code could not be added here (more than 100 chars)
what i am having problems with is the images in the second table down () keep flashing on and off when the mouse is moving over them, this does not do this in other sites i have seen this done in.
please can anyone see what i may have missed out or what is in the code that should not be there that may be causing it to flash.
thanks in advance for your help.
<html>
<head>
<style type="text/css" media="all">
.rollover a:hover img {
visibility: hidden;
}
* html a:hover {
visibility: visible;
}
.bl { background-image: url(/images/beaver_age.png); }
.cl { background-image: url(/images/cub_age.png); }
.sl { background-image: url(/images/scout_age.png); }
.el { background-image: url(/images/explorer_age.png); }
.nl { background-image: url(/images/network_age.png); }
/* RAR Rollover end */
</style>
</head><body>
<table width="963" height="419" border="1" cellpadding="0" cellspacing="0" bordercolor="#111111" id="AutoNumber1" style="border-collapse: collapse; border-width: 0">
<tr>
<td width="100%" bgcolor="#879EC7" style="border-style: none; border-width: medium" height="17">
</td>
</tr>
<tr>
<td width="100%" style="border-left: medium none #111111; border-right: medium none #111111; border-top-style: none; border-top-width: medium; border-bottom-style: none; border-bottom-width: medium" height="16" bgcolor="#FFCC66">
<table width="100%" align="center" class="rollover">
<tbody>
<tr>
<td width="132"> </td>
<td width="128">
<div class="bl">
<div align="center"><a href="/beavers/index.php"><img src="images/beaver_logo.png" alt="Beavers (6-8yo)" /></a></div>
</div></td>
<td width="65"> </td>
<td width="132"> <div class="cl">
<div align="center"><a href="/cubs/index.php"><img src="images/cub_logo.png" alt="Cubs (8-10.5yo)" /></a></div>
</div></td>
<td width="65"> </td>
<td width="132"> <div class="sl">
<div align="center"><a href="/scouts/index.php"><img src="images/scout_logo.png" alt="Scouts (10.5-14yo)" /></a></div>
</div></td>
<td width="65"> </td>
<td width="132"> <div class="el">
<div align="center"><a href="/explorer/index.php"><img src="images/explorer_logo.png" alt="Explorers (14-18yo)" /></a></div>
</div></td>
<td width="65"> </td>
<td width="132"> <div class="nl">
<div align="center"><a href="/network/index.php"><img src="images/network_logo.png" alt="Network (18-25yo)" /></a></div>
</div></td>
<td width="132"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td width="100%" style="border-left: medium none #111111; border-right: medium none #111111; border-top-style: none; border-top-width: medium; border-bottom-style: none; border-bottom-width: medium" height="16" bgcolor="#FFCC66">
</td>
</tr>
</table>
</body>
</html>