代码之家 › 专栏 › 技术社区 › Louis W

将绝对位置的项目置于相对项目之上。(即)

css

Louis W · 技术社区 · 16 年前

请参阅 test site . 在IE(6&7)中遇到问题,使绝对定位的项目出现在相对定位的项目上。

黄色框(绝对)应显示在蓝色框(相对)上方。我试着让蓝色的z指数低于黄色,但这似乎不起作用。

任何帮助都会很好。

2 回复 | 直到 15 年前

peirix 16 年前

#orange {
   position: relative;
   z-index: 1;
   background-color: orange;
}
#blue {
   background-color:blue;
   height:100px;
   overflow:hidden;
   position:relative;
   width:300px;
}

user151323 user151323 16 年前

明确指定蓝色框的z索引:

#yellow {
background-color: yellow;
width: 100px;
height: 150px;
position: absolute;
z-index: 200;
}

#blue {
width: 300px;
height: 100px;
overflow: hidden;
background-color: blue;
position: relative;
z-index: 100;
}

更好的是,为所有三个框指定z-index,以消除浏览器的任何误解。

推荐文章