for a minor revamp of the web application i’m working on at work, i want to implment this css vertical menu. i was thrilled to find that it works great in IE 5.5 which is something we still need to support. after i put everything together, i realized it is not going to work due to this notorious SELECT z-index IE bug. basically IE ignores the rule of z-index when it comes to select tag. this means when the css menu popup out in the area where there is a select tag, in IE, the select tag will be rendered on top of the popup menu. the ONLY way you can place a layer on top of any SELECT tag in IE is by adding an iframe in the html source on top of the select. altho there is a pure css way to fix this issue, it’s far from pretty.

i’ve applied the fix to my css vertical menu now and it works locally. BUT i know i’m gonna run into more issues. because the app will be on a secure server (https) and in IE it will show security alert when you have iframe tag without the src attribute. i ran into this problem before trying to use the thickbox script. i had to put a real https URL in the iframe tag for IE to shut up. but i really don’t know how everything’s gonna turn out until i’ve switched everything over and the app is deployed to the secure server.

this is the wonderful IE. you have to use ugly hacks to fix its shortcomings and then add more unnecessary code to get around the problem the hacks cause.

isn’t it lovely?