The issue I'm experiencing can be seen easily at http://foodishi.com. This is a subtheme built on the Zen framework, and was my first custom theme within that framework. It works very well in Chrome, Firefox, and IE9+. Unfortunately, in IE8 there are a few problems on the home page. After spending a couple days on it, I successfully got the featured recipe area to display correctly on my development copy, but the main menu is still broken.
The superfish library appears to be working, IE8 dev tools show the sub-menu as being in the correct position, but some background color changes indicate to me that the menu is likely rendering behind the page. The most common fix for that problem I found in my searching is applying "position: relative;" to the body or main content area, but this was ineffective. I also experimented with applying "position: relative;" and appropriate z-indexes to every element that the submenus are supposed to be on top of, but that didn't work either.
Any help that can be rendered here would be greatly appreciated, thank you in advance.
Comments
Fixed.
As a word of warning to anyone else, I want to describe the issue I was running into.
In IE < 10, normal gradients don't work at all, and filter gradients must be used. I applied filter gradients to the li's in my menu. On the top level links, the filter gradient applied just fine and looked correct. The side effect though was that it caused the sub-menus to be completely invisible. So while it appeared to be a z-index issue (it was there, but not visible), it was the filter gradients.