Menu posities

[slabbetje]

Hi helpers,

Ik ben op dit moment bezig met een menu voor wordpress ik zit alleen met een probleem...
Ik wil de indeling als volgt hebben alleen dit krijg ik niet voor elkaar ookal heb ik alles geprobeerd...

-- MAIN1 -- MAIN 2 --
-- SUB 1 -- SUB 2 -- SUB 3 --
-- SUBSUB1_1 ---------------
-- SUBSUB1_2 ---------------
-- SUB 4 -- SUB 5 -- SUB 6 --

Ik gebruik nu de volgende sheet:

/*MainItems*/
ul.menu {
	float: 							left;
	margin: 						0px; 
	padding: 						0px;
	display:						block;
	width:							760px;
}

.menu li, .menu li a
{
	float:							left;
	font-size:						11pt;
}

.menu li{
	list-style: 					none;
	position: 						relative;
	margin-left:					5px;
	height:							25px;
}

.menu li a
{
	color:							#6a6a6a;
	text-decoration:				none;
	background:						url('content/images/theme/top_item_left.png') left top no-repeat;
	font-weight:					normal;
	padding:						2px 0px 3px 0px;
}

.menu li span.corner
{
	background:						url('content/images/theme/top_item_right.png') right top no-repeat;
	padding:						2px 5px 3px;
}

.menu li:hover span.corner
{
	background:						url('content/images/theme/top_item_right.png') right bottom no-repeat;
}

.menu li:hover a
{
	color:							#FFFFFF;
	background:						url('content/images/theme/top_item_left.png') left bottom no-repeat;	
}

/*Submenu 1 Diep*/
.menu li > ul, .menu li > div
{
	/**/display:						none;/**/
	position:						absolute;
	left:							0;
	top:							100%;
	width:							630px;
	padding: 						0px;
	margin: 						0px;
}

.menu li:hover > ul, .menu li:hover > div
{
	display: 						block;
}

.menu li ul li
{
	margin:							0;
	margin-right:					5px;
	margin-bottom:					5px;
}


.menu li ul li a, .menu li:hover ul li a, .menu li ul li span.corner, .menu li:hover ul li span.corner
{
	color:							#6a6a6a;
	text-decoration:				none;
	font-weight:					normal;
	padding:						2px 5px 3px;
	background:						#f4f4f4;
	width:							190px;
}


/*Submenu 2 Diep*/
.menu li ul li ul, .menu li ul li > div
{
	padding: 						0px;
	margin: 						0px;
	top: 							100%;
	z-index:						2;
}
.menu li ul li ul li:first-child
{
	padding: 						0px;
	margin: 						0px;
}

Wanneer ik nu de z-index weghaal komt het 2 diep gedeelte onder het 1 diep gedeelte ipv dat het er netjes tussen schuift... en ik zit vast aan de waardes van wordpress omdat de complete template uit wordpress bestaad

 

[csshunter]

Hoi slabbetje,
Hoe ziet je html er uit?

Met vriendelijke groet,
CSShunter