kikko: Bilder übereinander positionieren

Beitrag lesen

SELF-Forum

Bilder übereinander positionieren

kikko
– Informationen zu den Bewertungsregeln

drin bild, drunter p oder span mit text
bild überlagerst du mit absolutpostioniertem gleichroßem - dann brauchst du nix zu zentrieren. absolut epositionierung wird von der linken oberen eke des ersten nicht static-positionierten

Danke!
Habe es so probiert. Leider wird das Bild darüber bei absolut an der Fensterecke oben links positioniert.

<!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;}  
			#galerie  {margin-bottom: 20px; }  
			#galerie li{ list-style-type: none; margin-right: 15px; margin-bottom: 20px;  width: 160px; float: left }  
			#galerie li span   { color: #7b8c94; padding-left: 4px }  
			#galerie li a      { color: #7b8c94; text-decoration: none; background-image: none; padding-left: 2px }  
			#galerie li a strong    { text-decoration: none; background-image: url(images/dreieck_doppelt.gif); background-repeat: no-repeat; background-position: right center; padding-right: 15px }*/  
			  
			#galerie  { }  
			#galerie .play    { background: url(images/video-play.png) no-repeat; position: absolute; top: 0px; left: 0px; width: 160px; height: 120px }  
			#galerie .play:hover  { background: url(images/video-play_over.png) no-repeat; }  
			#galerie li{ list-style-type: none; }  
			#galerie li a    {  text-decoration: none; background-image: none;}  
			--></style>  
	</head>  
  
	<body bgcolor="#ffffff">  
	<div id="galerie">  
	<ul>  
	<li><a href="link1.html" target="_blank">  
	<img src="media/public/thumbs-index/img1.jpg" />  
	<img class="play" src="images/trans.gif" title="play" alt="play" />  
	<span>Text</span></a></li>  
	<li><a href="link2.html" target="_blank">  
	<img src="media/public/thumbs-index/img2.jpg" />  
	<img class="play" src="images/trans.gif" title="play" alt="play" />  
	<span>Text</span></a></li>  
	<li><a href="link3.html" target="_blank">  
	<img src="media/public/thumbs-index/img3.jpg" />  
	<img class="play" src="images/trans.gif" title="play" alt="play" />  
	<span>Text</span></a></li>  
	</ul>  
	</ul>  
	</ul>  
	</div>  
	</body>  
  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln