Question

php页面中ie下css的z-index问题

页面中，显示如下图所示的效果，

初始图如下：

在鼠标移到市名上时显示一个浮动框，浮动框里显示县区下拉框，我在页面中读出数据库后先循环省，然后循环市，然后在浮动框的代码是这样的
<div style="style="min-width:50px;height:20px;float:left;line-height:20px;position:relative;" onmouseover="show_districtbox('.$map['serialId'].');" onmouseout="hide_districtbox('.$map['serialId'].');"">

'.$map['cityName'].'  
<div style="width:200px;min-height:120px;position:absolute;top:0;left:0;z-index:5000;background:#FFFFFF;border:1px solid #CCCCCC;display:none;" id="districtbox_'.$map['serialId'].'">

<br class="clear" />
</div>
</div>
在chrome,ff下都能正常显示，但在IE下却这样显示：

注意了，这里，指向的市名会被置于浮动框之下，但没有指向的却一直在浮动框的层级之上，我试过父元素加z-index，不起作用，把浮动去了，也不起作用，仍然是：

后面那个“密云”就一直在浮动框之上，这是什么原因造成的，如何解决？急，在线等！
注意：直接在页面里写html代码没事，但用在循环里就出现这个问题，且只有在IE里有这个问题，本地测试也没问题（包括IE），传到服务器上就出现这个情况，求高手解答！！！！！！！





Answer 1

试试鼠标经过之后给父亲加position:relative;

或者暂时先把position加给父亲的父亲看看有没有遮挡问题；

暂时不明白是什么问题，感觉鼠标经过之后发生了其他的什么事的样子；

追问

我也觉得是发生了其他的什么事的样子，问题是不知道发生了什么事。。。。
position加在父亲的父亲之类的都试过了，还是无效的

追答

我用你的样子做了测试，发现父亲的兄弟都有relative的时候会出现你那个情况，你试试鼠标经过才给添加那个relative样式

图片中第一个是你目前的效果，后一个是用我说的方法之后的效果；

.parent:hover{

  position:relative;

}

区别是上面一句，不过hover这个属性ie6下不能加给div，你用js给就行了

Answer 2

给下拉的框加一个背景试一下！！

追问

这个方法试过了，没用的

追答

嗯，刚刚我看了一下，select在ie6下面就是有这个bug，看你们怎么处理了。一般这种情况我直接就无视了，毕竟IE6越来越少了。
网上找的解决方案，你可以看下：
1，通过iframe遮盖select。
2，通过js控制select的显示和隐藏

嗯，希望能帮到你，望采纳！

追问

js我试了，没起作用，与select无关，把select去掉也是一样的，select是在内部的DIV里的

追答

你用ie什么版本测试是这个情况！

追问

ie8

追答

奥

解决了吗

有问题继续交流

Answer 3

div的宽度问题

追问

哪一个div的宽度有问题？父？子？