problem with layer highlighting

I'm having a problem with this HTML page in firefox: when you click anywhere in the grey area, the two layers containing images are highlighted (a translucent effects covers them). The only way to un-highlight them is to click on the white background.

How can I get rid of this unwanted effect?

It doesn't do this in IE.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
TD.main {
background: #cccccc;
height: 541px;
width: 843px;
border: 1px solid;
}
</style>
</head><body bgcolor="#FFFFFF">
<table border="0" cellspacing="0" cellpadding="0" align="center">
 <tr valign="top"> 
 <td class="main"> 
 
 <div id="Layer1" style="position:absolute; width:105px; height:115px; z-index:1; left: 103px; top: 363px">
 <img name="Image1" border="0" src="http://image.example.com/thumbnail/image_a5.gif" width="106" height="142"></div>
 <div id="Layer2" style="position:absolute; width:105px; height:115px; z-index:2; left: 279px; top: 306px">
 <img name="Image2" border="0" src="http://image.example.com/logo/image_logo_new.jpg" width="405" height="130"></div>
 
 </td>
 </tr>
</table></body>
</html>

[edited by: incrediBILL at 12:47 pm (utc) on June 26, 2009]
[edit reason] exemplified URLs, no specifics please [/edit]

problem with layer highlighting

Driber

penders

Driber

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week