Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 24.09.2008, 18:19
-Oliver- -Oliver- ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.02.2005
Beiträge: 25
-Oliver- befindet sich auf einem aufstrebenden Ast
Standard [solved] Floatende Liste mit absoluten Elementen

Hi,

eigentlich dachte ich, meine Idee ist relativ einfach umzusetzen, jedoch habe ich mich geirrt, deshalb bitte ich um eure Hilfe.

Ich habe eine Liste mit Elementen (wird gefloatet und hat einen Rahmen) und in diesem Elementen gibt es eine Box, welche über die aktuelle und das nächste Element erscheinen soll.

Folgenden Code verwende ich hierfür:

HTML-Code:
<html>
	<head>
		<style>
		li{
			float:left;
			list-style:none;
			border:1px blue solid;
			padding:15px;
			position:relative;
			z-index:5;
			background-color:yellow;
		}
		li div {
			background-color:red;
			height:30px;
			width:30px;
			position:absolute;
			z-index:10;
			right:-10px;
		}
		</style>
	</head>
	<body>
		<ul>
			<li>Menu1<div></div></li>
			<li>Menu2</li>
			<li>Menu3</li>
			<li>Menu4</li>
		</ul>
	</body>
</html>

Leider erscheint aber die Box UNTER dem nächsten Element (Siehe Screenshot). Habt ihr irgendwelche Tricks auf Lager? Bitte zu beachten, dass der HTML-Code nicht geändert werden kann, bzw. nicht soll.

LG & vielen, vielen Dank im Voraus,
Oliver
Angehängte Grafiken
Dateityp: jpg screenshot.jpg (6,8 KB, 9x aufgerufen)

Geändert von -Oliver- (26.09.2008 um 12:24 Uhr) Grund: Problem wurde gelöst.
Mit Zitat antworten
Sponsored Links