Menu Unter Menu

[Forumsgast]

Hi,

ich würde gerne ein Menü erstellen das wie folgt aussieht:

|||||||||||||||Main||||||||||||||||||||||
||||||||||||||||||||||||Link|||||||||||||Link|||||||||||||||||

Wobei die Link Sachen erst gezeigt werden sollen, wenn man mit der Maus über Main drüber fährt.
Das habe ich auch schon hinbekommen:

			<div id="menu">
				<div id="home" class="left">
					Christ Camp
					<div id="dropdown_home" class="dropdown">
						1
						2
						3
						4
					</div>
				</div>
				<div id="home" class="left">
					Malte
					<div id="dropdown_home" class="dropdown">
						1
					</div>
				</div>
			</div>

Der CSS Teil:

#menu {
	width:100%;
	height:30px;
	background-color:#33A3DC;
	font-size:12px;
	color:#ffffff;
	font-weight:bold;
	text-align:center;
	padding-top:4px;
	padding-bottom:4px;
	border-bottom:1px solid #ececec;
}

div.dropdown {
    display: none;
}
div#home:hover div#dropdown_home{
    display: block;
}


a.down_link {
    font-size: 12px;
    color: #000000;
    text-decoration: none;
    line-height: 20px;
}
a.down_link:hover {
    color: #2e7fff;
    text-decoration: underline;
}

Das Problem ist, jetzt stehen die Main links untereinander. Und wie kann ich die Links die erscheinen weiter nach rechts verschieben?
Danke

[Forumsgast]

.left {
float: left;
}

[Kein Genie]

.left {
float: left;
}

Wie bekomme ich es jetzt hin, dass er das Menü ausklappt (macht er schon) aber so das er über alle anderen sachen drüber liegt?

[Forumsgast]

position:absolute oder fixed vielleicht?

[Kein Genie]

fixed war es, danke.

[Forumsgast]

Also ich würde ne andere Lösung suchen.

Die Angabe fixed wird vom Internet Explorer für Windows nicht unterstützt, Netscape unterstützt sie seit Version 6.1. Auch neuere Opera-Versionen können damit umgehen.

[Kein Genie]

Also ich würde ne andere Lösung suchen.

Die Angabe fixed wird vom Internet Explorer für Windows nicht unterstützt, Netscape unterstützt sie seit Version 6.1. Auch neuere Opera-Versionen können damit umgehen.

Und der IE hat ein Problem das Menü an der richten Stelle auszugeben.
Wie kann ich das beheben?

[Forumsgast]

Was ist denn an position:absolute auszusetzen? fixed ist doch nur fürs Scrolling wichtig...

[Kein Genie]

Ja, bei FF macht es kein unterschied, aber beim IE wird es immer noch nicht richtig unter dem Main Text angezeigt sonder rechts daneben.

[Forumsgast]

Hast Du das beachtet:

absolute = absolute Positionierung, gemessen am Rand des nächsthöheren Elternelements, das nicht die Normaleinstellung position:static hat.

?

[Kein Genie]

ja,

#menu {
	width:100%;
	background-color:#33A3DC;
	font-size:12px;
	color:#000000;
	font-weight:bold;
	text-align:left;
	padding-top:4px;
	padding-bottom:4px;

}

div#home:hover div#dropdown_home{
    display: block;
	border:1px dashed #646464;
	padding:3px;
	color:#ffffff;
	background-image:url('images/pic_main_bg.jpg');
	position:absolute;
}

						<div id="home" class="left">
							Christ Camp|
							<div id="dropdown_home" class="dropdown">
								Home

								Camp Story

								Camp Tour

								Rundgang

								Camp Team

								Camp Blatt

								Freundeskreis
							</div>
						</div>

So müsste ja das div id="home" das nächst höre sein oder nicht?

[Forumsgast]

Fehlt da ein Komma?

div#home:hover div#dropdown_home

[Forumsgast]

Jo da fehlt ein Komma... Also wird Firefox diese Regel ganz ignorieren, wundert mich aber, warum er es dann doch richtig darstellt...

[Forumsgast]

Nimm mal außerdem :hover bei div#home:hover raus...

[Kein Genie]

wenn ich das hover rausnehme dann zeigt er es nicht mehr an.