CSS hover image link not working in IE

Please mouse over to "Pebbles Wash" and click the image. It working fine in Chrome and Firefox, but the link not working in IE. Here's my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Konzept Garden</title>
<style type="text/css">
* {margin: 0; padding: 0;}
#main {
width: 520px;
height: 228px;
background-image: url(stone.jpg);
background-repeat: no-repeat;
position: relative;
margin: 0 auto;}

#main ul li {
list-style: none;
display: inline;}

#main ul li:hover {
visibility: visible;}

#main ul li a {
position: absolute;
z-index: 1;}

#main ul li a:hover {
z-index: 100;}

#main ul li img {
position: absolute;
top: 300px;
right: 999em;}

#submain1 .butt1 a {
left: 8px;
top: 80px;
 width: 90px;
height: 32px;}

#main ul .butt1:hover img {
 left: 8px;
 top: 80px;}
</style>
</head>
<body style="margin: 0px; width: 520px;">
<div id="main">
<ul id="submain1">
<li class="butt1"><a href="http://example.com/p_pebbles.html" target="_blank"></a><img src="p1.png"></li>
</ul>
</body>
</html>

Anyone any idea? Please help, thanks in advanced.

[edited by: alt131 at 5:25 am (utc) on Oct 3, 2011]
[edit reason] Thread Tidy - Examplifying [/edit]

CSS hover image link not working in IE

dreamee

penders

dreamee

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week