Hello. I was asked to code a website that uses a very unconventional style of Nav. I don't think the designer was thinking that everything would one day need to be recreated with HTML and CSS. Anyway, what we have is more like three Nav structures in that there are three separate unordered lists being utilized. One for each button.
Since the outer two don't have drop down suckerfish navs we don't need to worry about those, they function fine. The problem lies with the "About The Fund" button in the middle. The only way I could figure to get a dropdown suckerfish menu working on that was to nest another <ul> within an <li> of a parent list. I realize that this makes this structure unlike the other two in it's markup and that this may be causing some difficulty, but I don't think so since the div I am rolling over is higher up in the markup (meaning less nesting).
What I'd like to see happen is when you rollover the entire div with a class="threeNav_pos2_off" the text would change to white. Again the other two are working fine so you can roll over those to see how the middle button should work. It's just that it will also slide down the suckerfish list. It may look as though this is working, but if you look close you will see that the text only changes to white if you mouse directly over the actual anchor tag. Or, for some reason, if you mouse over the button in an upward direction from the bottom. If you roll into the area from the top, the text stays dark until you encounter the anchor ...
Somewhere in my CSS I must have something that is over riding this effect because the text stays #353535 throughout. I'm using the entire containing div (.threeNav_pos2_off) as my "hotspot" for the hover behavior.
So, what I'd like to understand is how to make that text change it's color to white. Or if worst comes to worst, maybe I need to rebuild this entire thing. Is there a better method for doing a drop down like this when not utilizing the traditional "list" style markup for their navigation.