Zum Inhalt springen

LayerMenü funktioniert nicht richtig

Erstellt am 7. Dezember 2008 · 3 Antworten · letzte Antwort am 14. Dezember 2008

Tags: HTML & CSS, Frage

mbuchegger ·

Ich hab das Problem, das mein LayerMenü nicht horizontal sondern vertikal ist.
Leider finde ich den Fehler nicht, vielleicht hat hier jemand eine idee?!

TS:

MENUE1 = HMENU
MENUE1 {
         special = directory
         special.value = 51
         
         1 = TMENU
         1 {
		expAll = 1
		wrap = <ul id="nav">|</ul>
		noBlur = 1
		NO = 1
		NO.wrapItemAndSub = <li>|</li>

		IFSUB = 1
		IFSUB.wrapItemAndSub = <li class="menuparent">|</li>
		ACTIFSUB < .IFSUB
	   }
         2 < .1	
         2.wrap = <ul>|</ul>
         }

CSS dazu:

/* MENUE1 - Layout */
#nav, #nav ul {
	float: left;
	width: 125px;
	list-style: none;
	line-height: 30px;
	color: #ffffff;
	font-weight: bold;
	padding: 0;
	border: solid #ffffff;
	border-width: 5px 0px;
	margin: 0;
	font-size: 16px;
	background-color: red;
	background-position: center;
	letter-spacing: 1px;
	text-indent: 5px;
	vertical-align: middle;
}
 
#nav a {
	display: block;
	width: 125px;
	color: #ffffff;
	text-decoration: none;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
 
#nav a.menuparent  {
	background: url(arrow.gif) no-repeat 90% 40%;
}
 
#nav li {
	float: none;
	padding: 0;
	width: 120px;
}
 
#nav li ul {
	position: absolute;
	left: -999;
	height: auto;
	width: 210px;
	font-weight: normal;
	margin: 0;
	border-top-width: 5px;
	border-right-width: 5px;
	border-bottom-width: 5px;
	border-left-width: 5px;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 1px;
}
 
#nav li li {
	width: 210px;
}
 
#nav li ul a {
	width: 210px;
	padding-left: 0;
}
 
#nav li ul ul {
	margin: 0 0 0 0;
}
 
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	color: red;
	left: 0px;
}
 
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	color: red;
	left: auto;
}
 
#nav li:hover, #nav li.sfhover {
	color: red;
	background: #000000;
}
einpraegsam.​net ·

Naja, du musst deine einzelnen Listenobjekte schon mit display: inline; oder float: left; kennzeichnen, wenn du willst, dass diese automatisch horizontal angeordnet sind!

DerRobert ·

Hallo,

Wenn du den Link zur Seite schickst bzw. mit dem Firebug(Firefox extension) herumprobierst sollte das schnell zu lösen sein.

liebe Grüße
Robert