horizontal CSS-menu and collaps of sub-items problem

[mev]

Goodmorning all!

On my test-site  I'm running CMS Made Simple 1.0.4 and have a problem with the horizontal CSS-menu:
-the dropdown (secondary) menu-items do collaps, but the lower ones disappear partly behind other elements positioned on the page, especially if such other item has a background specified ! I could change the background of such elements to transparent, but that's not always possible/meant to be in this layout
-And, apart from that, the secondary menu-items are anyway hardly to be clicked on, they just disapear quickly, users have try over and over again.

These problems exist in IE6, IE7, Firefox 2

I made my own template, put  {menu template='cssmenu.tpl'} in it.
Connected stylesheets are;
-my own css
-the standard stylesheet "Navigation: CSSMenu-Horizontal" (which I adapted)
-the standard stylesheet: "Accessibility and cross-browser tools"

The test-page (working on it for a client) can be seen at:
http://www.willemijnstraeter.nl/cmsmade ... ge=home-kl

It regards the meni-item: 'Klinefelter Syndroom' and especially it's 2nd drop-down sub-item 'Publicaties'
(the other menu-items are there for testing out another site earlier)

I'm trying to find a solution since 2 days (!!), but cannot find it!
Is it a css-problem, or something to do with this cssmenu-template?

Could someone pleaseplease be so kind to have a look??
Thanks so much in advance !!

Willemijn

[Dr.CSS]

The problem is you have position: absolute/relative on everything... use it only when absolutely necessary... margins and padding are much better choices... 

[Nullig]

If you change your menu div to have:

height: 40px;

so it's not covering the top of your content boxes and remove the z-index from the

#linkercontent  and  #rechtercontent

divs, that should make the menus visible.

Nullig

[mev]

The problem is you have position: absolute/relative on everything... use it only when absolutely necessary... margins and padding are much better choices...   

Why is that bad, mark??

willemijn

[mev]

If you change your menu div to have:
height: 40px;
so it's not covering the top of your content boxes and remove the z-index from the
#linkercontent  and  #rechtercontent divs, that should make the menus visible.

Nullig

Thanks a lot Nullig,
that works, great!


willemijn