Mr. Smith: CSS-Galerie: Abstand Fehler im IE 7

Beitrag lesen

Hallo,

ich versuche mich momentan an eine CSS-Galerie mittels "hover".
Sobald man mit der Maus über das kleine Bild fährt, erscheint darunter das Bild im größeren Format.

Das Problem ist, dass im IE 7 zwischen kleinem und großem Bild ein Abstand entsteht, was aber in den anderen aktuellen Browsern (Firefox, Opera, Safari, Chrome) nicht der Fall ist, denn dort wird alles richtig (ohne Abstand) gezeigt.

Im IE 6 funktioniert es sowieso nicht und IE 8 habe ich nicht ausgetestet.

Kann sich jemand den Abstand erklären und mir villeicht eine Lösung vorschlagen?

Gruß

Hier mal mein html-code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>CSS-Galerie-Test</title>  
[code lang=css]  
<style type="text/css">  
<!--  
img {  
	border:none;  
}  
  
#box1{  
	height:41px;  
	width:55px;  
	padding:0px;  
	float: left;  
}  
  
#box1 #rahmen{  
	display:none;  
}  
  
#box1:hover #rahmen{  
	display:block;  
	width:640px;  
	height:480px;  
	font:normal 11px  Arial, Helvetica, sans-serif;  
	background-image: url(bild_groß_01.jpg);  
	float: left;  
}  
  
-->  
</style>  

</head>
<body>

<div id="box1">
     <a href="#"><img src="bild_klein_01.jpg" width="55" height="41" alt=""></img></a>
        <div id="rahmen">

</div>
    </div>

</body>
</html>

[/code]