Suckerfish menu not working in IE7
I'm working on this website: http://www.emiel-stopler.nl / david
(Almost) everything works fine, but I can't get the 1-level suckerfish menu to work in IE7.
It's built as follows:
Code:
<div id="header">
<div class="mod_navigation block">
<ul class="level_1">[*]item 1[*]item 2
<ul class="level_2">[*]subitem 1
etc.[/list]
etc.[/list]
</div>
</div>
In the styling, the header has a relative position and the mod_navigation div is absolutely positioned, with
thus displaying the menu at the bottom of the header div. It works fine in IE8, but in IE7, you can't click the subitems. When you eliminate the "top: 170px;" (thus displaying the menu item at the top of the header div), the subitems work fine, but I would like it to work at the bottom of the header div, obviously.
Does anybody have any ideas?
Re: Suckerfish menu not working in IE7
The issue here is to Z-index your header something like Z-Index:2 and your content div to something lower like Z-index:1.
I bet your screaming at me that you use relative positioning and not absolute. Well just do it and it should work and I can't explain it myself.
Re: Suckerfish menu not working in IE7
Thanks for your reply. I'd tried everything I could think of with the z-index, but no luck. I managed to solve the issue by completely rebuilding the site and using that as a template, instead of using the TL framework (if you know what I mean).
Re: Suckerfish menu not working in IE7
johan is actually right, you probably didn't try this. IE has a z-index bug where it resets the z-index stack for elements that are higher up in the html structure. This is exactly what seems to happen in the case you describe. ;)
I thought this being a suckerfish issue you could find a solution yourself, and you did :D Well done...
Weer een les geleerd!