Web Design by Sheriar Designs: Impeccable Code | Beautiful Design

Some things really frustrate me … I mean REALLY frustrate me! One of those things is the CSS drop-down or fly-out menu. I know - it’s supposed to be simple and easy, ala HTML Dog’s Sons of Suckerfish. Yet, somehow, it’s never actually easy - layouts need to be changed, new bugs having to do with those layouts are uncovered, javascripts and htdocs that worked perfectly on other sites mysteriously don’t work now. Almost every time, I think to myself, “This is going to be easy! I’ve done something very similar to this recently!” And almost every time I am wrong. There’s always a new wrench in the works.

Well, this time the wrench was IE7. I had a functioning drop-down/fly-out menu which made use of the Hover Whatever method, but for some reason, SOME REASON which I couldn’t for the life of me discover, IE7 just would not display that third-level nav list. The second level would appear just fine, but that third level was invisible … would never show itself upon hover. I tried absolutely everything I could think of - I rewrote the code again and again, trying angle after angle. But no matter how I wrote it, I just couldn’t get it to work for all the tea in China. Finally, FINALLY (can you sense my frustration?) I found a solution. A weird solution which didn’t make any sense to me at all, but a solution nonetheless.

We’ve all been frustrated by float bugs in IE - all versions of IE. There’s the Double Margin bug, the Drop Float bug, the Three Pixel bug, and the myriad other mysterious float problems.