Question

下拉列表被<select><option>挡住 怎么解决

代码如下：
<div id="menu" style="position:absolute; visibility:hidden; top:20px; left:20px; width:100px; height:200px; background-color:#6699cc;">
<table>
<tr><td>item 1</td></tr>
<tr><td>item 2</td></tr>
<tr><td>item 3</td></tr>
<tr><td>item 4</td></tr>
<tr><td>item 5</td></tr>
</table>
<iframe style="position:absolute; visibility:inherit; top:0px; left:0px; width:100px; height:200px; z-index:-1; filter='PageRankogidXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe>
</div>
<a href="#" onmouseover="document.getElementById('menu').style.visibility='visible'">menu</a>
<form>
<select><option>点击三角，这个option怎么隐藏？</option><option>点击三角，这个option怎么隐藏？</option><option>点击三角，这个option怎么隐藏？</option></select>
</form>
问题重现步骤，点击下拉列表框，然后经过menu 菜单被option挡住
select显示在菜单下面，但是option项显示在菜单上面。求解！！！！

Answer 1

你加了透明代码 肯定会挡住！把他们分开

<div id="menu" style="position: relative; visibility:hidden; top:20px; left:20px; width:100px; height:200px; background-color:#6699cc;">
<table>
<tr><td>item 1</td></tr>
<tr><td>item 2</td></tr>
<tr><td>item 3</td></tr>
<tr><td>item 4</td></tr>
<tr><td>item 5</td></tr>
</table>
<iframe style="position:absolute; visibility:inherit; top:0px; left:0px; width:100px; height:200px; z-index:-1; filter='PageRankogidXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe>
</div>
<a href="#" onMouseOver="document.getElementById('menu').style.visibility='visible'">menu</a>
<form>
<select><option>点击三角，这个option怎么隐藏？</option><option>点击三角，这个option怎么隐藏？</option><option>点击三角，这个option怎么隐藏？</option></select>
</form>

追问

我现在的重点是option挡住了下拉菜单，你看看图片，。不管用什么办法。，option总会在下来菜单上