Juliane Herz: Mehrdim. Menüs mit CSS (EXPERTEN GEFRAGT!)

Beitrag lesen

Hallo!

Ich habe einen Code im Inet aufgeschnappt der mir mein <UL><LI> - Verschachteltes Menü zu einem schönen CSS-Menü macht.
Doch leider ist der CSS-Code nicht ausreichend. Er stellt die Ebenen nur bis zur 2. Ebene da. die Haupt und eine Sub-Ebene. Ich benötige aber einen CSS-Code der mir auch eine 3 oder gar 4 Ebene darstellt.

Jetzt habe ich auf anderen Seiten studiert, dass man das einfach mit mehrfachen ul ul li li ul ul ul ul ul macht, aber ich komm grad echt an meine grenzen :-/

Hat jmd. nen Tipp für mich oder irgendwas was mich weiter bringen könnte

Hier noch der Code:

  
  
.menu{  
	border:none;  
	border:0px;  
	margin:0px;  
	padding:0px;  
	font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;  
	font-size:14px;  
	font-weight:bold;  
	}  
.menu ul{  
	height:35px;  
	list-style:none;  
	margin:0;  
	padding:0;  
	}  
	.menu li{  
		float:left;  
		padding:0px;  
		}  
	.menu li a{  
		background: url("menubg.jpg");  
		color:#cccccc;  
		display:block;  
		font-weight:normal;  
		line-height:35px;  
		margin:0px;  
		padding:0px 25px;  
		text-align:center;  
		text-decoration:none;  
		}  
		.menu li a:hover, .menu ul li:hover a{  
			background: #2580a2 url("hover.gif") bottom center no-repeat;  
			color:#FFFFFF;  
			text-decoration:none;  
			}  
	.menu li ul{  
		background:#333333;  
		display:none;  
		height:auto;  
		padding:0px;  
		margin:0px;  
		border:0px;  
		position:absolute;  
		width:225px;  
		z-index:200;  
  
		}  
	.menu li:hover ul{  
		display:block;  
  
		}  
	.menu li li {  
		background:url('sub_sep.gif') bottom left no-repeat;  
		display:block;  
		float:none;  
		margin:0px;  
		padding:0px;  
		width:225px;  
		}  
	.menu li:hover li a{  
		background:none;  
  
		}  
	.menu li ul a{  
		display:block;  
		height:35px;  
		font-size:12px;  
		font-style:normal;  
		margin:0px;  
		padding:0px 10px 0px 15px;  
		text-align:left;  
		}  
		.menu li ul a:hover, .menu li ul li:hover a{  
			background: url("menubg.jpg");  
			border:0px;  
			color:#ffffff;  
			text-decoration:none;  
			}  
	.menu p{  
		clear:left;  
		}  

Danke
Juliane Herz