IE6下面 position:absolute 失效导致绝对定位层不显示的原因

作者:MJ 发布于:2012-9-6 5:01 Thursday 分类:Css

今天早上重构一个机票订购页面的时候,为了配合JS特效所以需要写一个绝对定位浮动层,写完在测试的时候发现,在FF、ie8、ie7、op下都可以正常显示,可是到了IE6的时候,这个绝对定位浮动层却无法显示,把CSS中“position:absolute”去掉后就可以显示出来,这是何原因呢?

 

经过baidu、goole折腾研究了半天后终于找到了原因,原来是这个绝对定位浮动层旁边紧邻的那个div层是个使用“float:left”左浮动,而导致这个绝对定位浮动层在IE6下无法显示,解决办法就是在这个绝对定位浮动层前面插入一个清除浮动的层。

 

总结:在IE6下面 position:absolute的绝对定位层前面紧邻的那个层如果有用到“float” css浮动属性会导致这个绝对定位层无法显示。请看下面两个对比案例演示。

 

1、这个是前面没有清除浮动层,绝对定位层无法显示的演示

 

2、这个是前面有清除浮动层,绝对定位层正常显示的演示

标签: 绝对定位 position:absolute

发表评论:

Powered by 588cy.com