kikko: Bilder übereinander positionieren

Beitrag lesen

Hallo Forum,

ich möchte auf einer Website mehrere Bilder mit Bildunterschrift nebeneinander positionieren. Jedes Bild soll mit einem transparenten png überlagert werden, welches bei rollover gegen ein anderes farbiges getauscht wird.

[URL=http://img189.imageshack.us/i/demoi.jpg/][IMG]http://img189.imageshack.us/img189/8570/demoi.jpg[/IMG][/URL]

Uploaded with [URL=http://imageshack.us]ImageShack.us[/URL]

Ich habe das nun mit css hover versucht. Doch sobald ich das transparente png-Bild relativ positioniere, muss ich eine Breite für dieses Bild angeben. Die Pixel werden dann aber unter dem Hauptbild addiert, so dass dort ein Abstand zwischen Bild und Text entsteht.

Wo liegt mein Fehler? Könnte mir bitte jemand einen Rat geben??

K.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  
<html>  
  
	<head>  
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">  
	  
		<style type="text/css" media="screen">  
		<!--#galerie .play  { background: url(images/video-play.png) no-repeat; margin-bottom: -190px; position: relative; top: -230px; left: 5px; width:160px; height:120px;  }  
			#galerie .play:hover  { background: url(images/video-play_over.png) no-repeat; margin-bottom: -190px; position: relative; top: -230px; left: 5px; width:160px; height:120px;}--></style>  
	</head>  
  
	<body bgcolor="#ffffff">  
	<a href="link1.html" target="_blank"><img src="media/public/thumbs-index/img3.jpg" /><img class="play" src="images/trans.gif" height="160" width="120" title="play" alt="play" /><strong>Text</strong></a>  
	</body>  
  
</html>