CSS Dropdown not showing in IE8 and 9

[Solodin]

I’m at my wit’s end here. I have a CSS dropdown that uses a simple display:none, display:block to show itself on the hover.

However,
In IE8: The first level dropdown is not visible outside of the parent main navigation.

In IE9: the first level dropdown is visible but the right side flyouts are not visible outside the containing box of dropdown.

I’ve tried everything I could think of and research from forcing z-index to 1000 to trying every combo of position across the elements and changing the DOCTYPE of the page.

Here is the page where you can see the problem: http://www.camelbackdisplays.com/test.html

Here is the CSS page for the navigation: http://www.camelbackdisplays.com/CSS/NewNav.css

The applicable code runs from lines 123 to 162.

Any ideas or help are greatly appreciated.

[Author]

Posts