Absolute Position zu relativen Punkten

Hi Leute! :smiley:

Ich habe eine Menüleiste am oberen Bildschirmrand, die durch „margin: auto“ horizontal in der Mitte positioniert wird. Mit JavaScript habe ich ein Untermenü für einen Menüpunkt erstellt. Das Problem: Dieser ist als „position: absolute“ eingebaut.
Er sollte aber immer unter dem Zweiten Menüpunkt sein. Alles in eine DIV-Container zu packen klappt nicht, weil danach ja noch was folgt und das Untermenü über „visibility“ an und aus geschaltet wird.

Hat jemand eine Idee?

Gruß Johannes

Kannst Du bitte den Quellcode hier her Posten? Das macht die Sache um einiges leichter und man kann Dir schneller helfen.

[SIZE=2]lascaux[/SIZE]

die anhangfunktion unter erweitert geht bei mir nich, darum hier der code so:

die html:

Test
<body>
	<div id="menu">
		<ul id="menulist">
			<li><a href="#">Item</a></li>
			<li><a onmouseover="openapp()" onmouseout="closeapp()" id="app" href="#">Apps</a></li>
			<li><a href="#">Item</a></li>
			<li><a href="#">Item</a></li>
			<li><a href="#">Item</a></li>
		</ul>
	</div>
	
	<!-- Menu -->
	<div id="appmenu" onmouseover="openapp()" onmouseout="closeapp()">
		<div id="appuntermenu">
			<a href="#">App 1</a>
			<a href="#">App 2</a>
		</div>
	</div>
</body>

die datei main.css:
#menu {
width : 800px;
height : 30px;
position : relative;
margin : 20px auto;
background-color: silver;
}

#menu a {
background-color: green;
margin : 0px;
border : 0px;
text-decoration : none;
text-align : center;
color : white;
}

#menu li {
background-color: green;
margin : 0px;
border : 0px;
text-decoration : none;
text-align : center;
color : white;
}

#menu a:hover {
background-color: lime;
}

#menu a:active {
background-color: darkgreen;
}

ul {
list-style: none;
}

#menulist {
display : block;
position : realtive;
margin : 0px;
padding : 0px;
}

li a {
background-position : 100%;
cursor : pointer;
float : left;
width : 160px;
height : 30px;
}

die datei: dropdown.css:
#appmenu {
position : absolute;
top : 50px;
left : 443px;
width : 160px;
visibility : hidden;
}

#appuntermenu {
width : 160px;
height : 30px;
}

#appuntermenu a {
background-color : green;
color : white;
display : block;
text-decoration : none;
text-align : center;
line-height : 30px;
}

#appuntermenu a:hover {
background-color : lime;
}

#appuntermenu a:active {
background-color : darkgreen;
}

#appuntermenu a:visited {
background-color : green;
}

#appuntermenu div {
margin : 0px;
padding-right : 30px;
padding-left : 15px;
padding-top : 1px;
}

und menu.js:
function openapp() {
document.getElementById(‚appmenu‘).style.visibility = ‚visible‘;
}

function closeapp() {
document.getElementById(‚appmenu‘).style.visibility = ‚hidden‘;
}

das problem ist, dass bei mir unter vollbild das untermenü an der richtigen stelle ist. bei euch hängt das wahrscheinlich iwo rum.
gruß

Dein Aufbau ist schon nicht durchdacht. Dropdown-Menüs baut man so wie z.B. hier beschrieben:
CSS DropDown Menu Tutorial Page 2
Drop-Down-Navigationsmenü mit CSS und (fast) ohne Javascript - Tutorial