日期:2014-05-17  浏览次数:20645 次

请教firefox中的层叠问题
html结构大概如下:
    <div   id= "header ">

          <div   id= "form "   style= "position:absolute ">
          </div>
         
    </div>

    <div   id= "content ">
   
    </div>

我想让 <div   id= "form "   展现在最上层,可是无论z-index怎么高,   <div   id= "form "   只能在 <div   id= "header "   里是最高层,   而会被   <div   id= "content "   的内容遮挡住  
(想要的效果在IE里是可以的)

网上有说这是因为fireFox   里层继承的问题( "form "在 "header "里,继承了 "header "的z-index:0)

可是我把 "header "的z-index:99,   "form "的z-index:999;

还是不行啊,不能遮住 <div   id= "content "

谢谢了,高手们!

------解决方案--------------------
content 清除浮动,试试
------解决方案--------------------
header有一个高度height,如果没有设定它的具体数值的话
它将根据header里面的具体内容伸长


但是,form因为position:absolute,所以form的实际高度并不令header加长

从这个角度去考虑
------解决方案--------------------
如果header没有定义高度的话,你觉得它会是多高呢?

content的顶边是紧贴header的底边,而不是紧贴form的底边

你随便把header换几个不同高度的值测试一下你就清楚了

------解决方案--------------------
#header {
postion: relative;
}
如果你说的是绝对定位的问题,在css上加上这句就OK了