Menüprobleme mit CSS?

Hallo Community!

Würde wiedereinmal eure Hilfe benötigen, hoffe mir kann jemand helfen!

Ich habe hier ein schönes Menü (von Just2b).
Leider schaffe ich es nicht die 2. Ebene so zu stellen, dass diese (wie hier auf typo3.net) untereinander geöffnet wird.

Wer kann mir weiterhelfen?

THX! Leo

TS:

subparts.menu = HMENU
subparts.menu {
        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>
 
        3 < .2
        4 < .2
} 

}

page {
headerData = COA
headerData.11 = TEXT
headerData.11.value = <script type="text/javascript" src="fileadmin/template_neu/vertikal_JS.js"></script>
}

CSS:

/* -------------------------------------------------------- */


ul#nav,
ul#nav ul {
	margin: 0;
	padding: 0;
	width: 145px; /* Width of Menu Items */
	border-bottom: 0px solid #ccc;
	background: #a5bdcf; /* IE6 Bug */
	color: black;
	font-size: 100%;
	}
 
ul#nav li {
	position: relative;
	list-style: none;
	}
 
ul#nav li a {
	display: block;
	text-decoration: none;
	color: #000000;
	padding: 3px;
	border: 0px solid #ccc;
	border-bottom: 1px solid #ccc;
	}
	
 
/* Fix IE. Hide from IE Mac \*/
* html ul#nav li { float: left; height: 1%; }
* html ul#nav li a { height: 1%; }
/* End */
 
ul#nav ul {
	position: absolute;
	display: none;
	left: 144px; /* Set 1px less than menu width */
	top: 0;
	}
 
ul#nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
 
ul#nav li:hover ul ul,
ul#nav li:hover ul ul ul,
ul#nav li.over ul ul,
ul#nav li.over ul ul ul { display: none; } /* Hide sub-menus initially */
 
ul#nav li:hover ul,
ul#nav li li:hover ul,
ul#nav li li li:hover ul,
ul#nav li.over ul,
ul#nav li li.over ul,
ul#nav li li li.over ul { display: block; } /* The magic */
 
ul#nav li.menuparent { background: transparent url(arrow.gif) right center no-repeat; }
 
ul#nav li.menuparent:hover,
ul#nav li.over { 
	background-color: #f9f9f9; 
}
 
ul#nav li a:hover { 
	background-color: #f9f9f9; 
}

/* -------------------------------------------------------- */

Oje, kann mir denn keiner weiterhelfen?

Mfg Leo

Hallo Just2b!

Erstmals Danke!
Das heisst ich habe hier keine Möglichkeit, oder?

Nunja, kennt jemand ein TSscript und/oder tutorial zu einem solchen Menü?

Mfg Leo

Du suchst soetwas

TS

lib.accessible_TMENUTYPO3 = HMENU
lib.accessible_TMENUTYPO3 {
	1 = TMENU
	1 {
		#expAll =1
		wrap = <div id="navcontainer"><ul id="nav1">|</ul></div>
		noBlur = 1
		NO = 1
		NO {
			wrapItemAndSub = <li>|</li>
		}
		ACT = 1
		ACT.wrapItemAndSub = <li id="nav1act">|</li>

		#ACTIFSUB = 1
		#ACTIFSUB < .IFSUB
	}
	
	2 < .1
	2 {
		wrap = <ul id="nav2">|</ul>
		ACT.wrapItemAndSub = <li id="nav2act">|</li>
		#ACTIFSUB < .ACT
	}
	
	3 < .2
	3 {
		wrap = <ul id="nav3">|</ul>
		ACT.wrapItemAndSub = <li id="nav3act">|</li>
		#ACTIFSUB < .ACT
	}
}

CSS

#navcontainer {border:1px solid #eee;width:250px;}

#nav1, #nav1 ul {
padding:0;margin:0;
}

#nav1 {
margin-left:50px;
border: 1px solid #eee;
text-align: left;
list-style: none;
}

#nav1 a, #nav1 a:active {
border-top: 1px solid #EBEBEC;
text-decoration: none;
display: block;
padding: 4px 0px 4px 20px;
background: #fff url(nav_pfeil_rot.gif) no-repeat 5px ;
color: #040000;
text-decoration:none;

}

#nav1 a:hover {
color: #BF2236;
}

/*#nav1 li:hover {
background-color: #f3f3f3;
}*/

#nav1act a:link, #nav1act a:visited, #nav1act a:visited {
background: #BF2236 url(nav_pfeil_weiss.gif) no-repeat 5px ;
color: #eee;
}

#nav1act a:hover {
xbackground-color:#eee;
text-decoration:none;
}

#nav2 {
list-style: none;
background:#fff;
}

#nav2 a:link, #nav2 a:visited, #nav2 a:active {
font-size:11px;
padding-left:40px;
color: #040000;
background: #f1f1f2 url(pfeil3.gif) no-repeat 28px ;
}

#nav2 li, #nav2 ul {
list-style:none;
border: 0px solid black;
display : inline
}

#nav2 a:hover{
color: #BF2236;
}

#nav2act a:link, #nav2act a:visited, #nav2act a:active #nav2act a:visited {
background: #e2e2e5 url(pfeil3_act.gif) no-repeat 28px ;
}
#nav3 a:link, #nav3 a:visited, #nav3 a:active {
padding-left:60px;
background: #fff url(l3.gif) no-repeat 48px;
}

#nav3act a:link, #nav3act a:visited, #nav3act a:active {
font-style:italic;
background: #fff url(l3_act.gif) no-repeat 48px ;
}

georg

THX, Just2b!

Werde dass nachher mal testen...

//EDIT:
Hat 1a funktioniert! Vielen dank! 😉

Mfg