Wonky Sub-Sub Menus in IE7

[tif_smith]

I’m working on cleaning up the CSS of a site for my client, and I cannot for the life of me figure out why the submenus of my submenus aren’t displaying as block. The menu items are set with a min-width of 182px, but any sub-submenu items that are smaller than that min-width end up displaying next to each other instead of stacking properly. Grr. It may not be an issue that can be solved (thanks, IE7), but employing customers want to know!

Here is the URL:

[goeducationaltravel.com](http://goeducationaltravel.com “GoEducationalTravel.com”)

You’ll see the sub-sub-menus that are being naughty when you rollover Tour Selector and then any of the countries below that choice (i.e. Ireland and Italy under Europe, etc.).

Suggestions are welcome!

[tomrogers123]

I think I might have found the issue. According to IE’s developer tools every list item in the dropdown menus has `float: left` applied to it. That would explain why they are displaying inline and not going full width. To overcome this, you might just have to use a very specific selector and set:

ul#main-nav li { float: none; }

Hope this helps. I’d be interested to know the outcome (I have no way of testing my theory).

[tif_smith]

Well, I gave that a try and messed around some more with floats, and unfortunately that didn’t fix anything. Blargh.

[Author]

Posts