<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>CSS Fix for IE6- SELECT Z-Index bug</title><style>/* Start Stupid IE Select Z-Index bug fix */#stupidIEBugWrapper{ position:absolute; z-index:10; cursor:move; top:5px; left:50px; overflow:hidden;/*must have*/ width:33em;/*must have width, can be any value*/;}#stupidIEBugWrapper iframe{ display:none;/*sorry for IE5*/ display/**/:block;/*sorry for IE5*/ position:absolute;/*must have*/ top:0;/*must have*/ left:0;/*must have*/ z-index:-1;/*must have*/ filter:mask();/*must have*/ width:3000px;/*must have for any big value*/ height:3000px/*must have for any big value*/;}/* End Stupid IE Select Z-Index bug fix */#actualContent{ background-color:#ccc; color:#000;}#seeWhatIMean{ position:absolute; top:50px; left:30px; background-color:#ccc; color:#000; z-index:10;}</style></head> <div> <select> <option>This is a select ---------------------------------------------</option> </select> </div> <div id="stupidIEBugWrapper"> <div id="actualContent"> Without the css hack the select below would<br>appear above the absolutly positioned div </div> <!-- The following conditional statement must be entered to work around the bug in IE6 and below --> <!--[if lte IE 6.5]><iframe></iframe><![endif]--> </div> <div style="margin-top:2em;"> <select> <option>This is a another select ---------------------------------------------</option> </select> </div> <div id="seeWhatIMean"> Without the css hack the select below<br>appears above the absolutly positioned div<br>rather than below it </div><body></body></html>