Question

Here is the sample site:

http://tronitech.brettatkin.com/solutions.asp

In IE 7, the drop-downs aren’t working correctly (really not at all). The do show on hover but that is about it.

This is my first attempt at working through creating CSS only drop-menus, so I’m welcome to all feedback and criticism about the code in general.

Thanks

Brett

Answer 1

A fix is very easy:

On line 266 of styles.css:

#nav ul li {
    float: left;
    position: relative;
}

change: #nav ul li to #nav > ul > li. Problem fixed.

That is, replace the descendant combinators (a space: ) with direct child combinators (>). This prevents the lis inside the submenus from having the problematic float: left, while still allowing the starting lis to keep float: left.