Rozwijane menu w css i chowanie się rozwiniętego menu pod zawartość strony, z-index nie działa Opcje

[MOniToR]

Strona http://www.goprojects20080129.dev.mamboassistance.com/

Znalazłem proste drop down menu css, wszystko ładnie śmiga tylko dla przykładu jak się najedzie na obrazek, który jest jako pierwszy element menu ucina rozwinięte menu, od momentu gdy nachodzi na cześć z zawartością strony. Kombinowałem z z-index ale nie przyniosło to żadnego efektu :/ Często mi się tak zdarzało w innych projektach, zazwyczaj jednak rezygnowałem z rozwijanego menu ale w tym przypadku tak zrobić nie mogę :/ proszę o pomoc...
CSS:

[HTML] pobierz, plaintext 
#menu {
	background:  url(../images/menu.png) no-repeat top left;
	width:524px;
	height:50px;
	text-align:left;
	float:right;
	z-index:400;
}
 
#cssdropdown, #cssdropdown ul {
padding: 0;
margin: 0;
list-style: none;
}
 
#cssdropdown li {
float: left;
position: relative;
}
 
.mainitems{
border: 1px solid black;
background-color: #562f2c;
}
 
.mainitems a{
margin-left: 6px;
margin-right: 8px;
text-decoration: none;
 
}
 
.subuls{
display: none;
width: 10em;
position: absolute;
top: 1.2em;
left: 0;
background-color: #562f2c;
border: 1px solid black;
}
 
.subuls li{
width: 100%;
}
 
.subuls li a{
text-decoration: underline;
}
 
#cssdropdown li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
top: auto;
left: auto;
}
 
#cssdropdown li:hover ul, li.over ul { /* lists nested under hovered list items */
display: block;
}
 
#restofcontent { /*wrap rest of content of the page inside this div*/
clear: left;
}
[HTML] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
<div id="menu"><ul id="cssdropdown">
 
<li class="mainitems">
<a href="http://www.cssdrive.com"><img src="templates/mbpc/images/menu_aboutus.png" alt="" height="20" border="0" /></a>
<ul class="subuls">
<li><a href="">Gordon Mac</a></li>
<li><a href="">Juiced Thoughts</a></li>
<li><a href="">The Daily Flight</a></li>
<li><a href="">GrapeFruit</a></li>
</ul>
</li>
 
<li class="mainitems">
<a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a>
<ul class="subuls" style="width: 15em">
<li><a href="">CSS2 Generated Content</a></li>
<li><a href="">Custom scrollbar colors</a></li>
<li><a href="">Markerless and "no indent" Lists</a></li>
</ul>
</li>
<li class="mainitems">
<a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a>
<ul class="subuls" style="width: 15em">
<li><a href="">CSS2 Generated Content</a></li>
<li><a href="">Custom scrollbar colors</a></li>
<li><a href="">Markerless and "no indent" Lists</a></li>
</ul>
</li>
<li class="mainitems">
<a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a>
<ul class="subuls" style="width: 15em">
<li><a href="">CSS2 Generated Content</a></li>
<li><a href="">Custom scrollbar colors</a></li>
<li><a href="">Markerless and "no indent" Lists</a></li>
</ul>
</li>
<li class="mainitems">
<a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a>
<ul class="subuls" style="width: 15em">
<li><a href="">CSS2 Generated Content</a></li>
<li><a href="">Custom scrollbar colors</a></li>
<li><a href="">Markerless and "no indent" Lists</a></li>
</ul>
</li>
</ul>
 
<div id="restofcontent">
<br />
 
</div></div>
[HTML] pobierz, plaintext 

Ten post edytował MOniToR 7.02.2008, 12:33:00

[MOniToR]

Strona to jest Joomla. Skrypt wziąłem stad http://www.cssdrive.com/index.php/examples...drop_down_menu/

Jaki kod potrzebujesz? Mi się wydaje, że zamieściłem cały odpowiedzialny za ten skrypt...

Edit:

No tak ale jak ja mam o zrobić na takim template jaki mam? Gdybym miał to zrobione tak, że najpierw jest menu a później zawartość to by było łatwo ale na tym to nie wiem...

Ten post edytował MOniToR 7.02.2008, 15:20:43