IE6下绝对定位层不显示

之前遇到一个超级坑的问题;

一个绝对定位的元素,在firefox,chrome,ie8-9下都可以正常显示,就是IE6中不显示.

尝试过设置z-index, float:left,display,block等,绝对定位的元素还是没有显示出来,

然而,我在此元素上加上 clear属性即可解决;

网上大神解决方法如下:

1、在绝对定位元素外层加一空白div,不应用任何样式.终于,绝对定位的元素显示出来了.

2、在采用“position:aboslute”进行绝对定位的元素前增加一个清除浮动的元素。

不会到会,只是一个过程!

时间: 2024-11-06 14:37:02

IE6下绝对定位层不显示的相关文章

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

在网上看到的,最近遇到好几次,总结就是 当你发现某元素在IE6,7下面无法显示的时候,且这个元素是经过position absolute的,加之前后之类的有浮动,你就要考虑一下兄弟元素,有时候是前面,有时候是后面,加一个<div class="clearboth"></div> 今天早上重构一个机票订购页面的时候,为了配合JS特效所以需要写一个绝对定位浮动层,写完在测试的时候发现,在FF.ie8.ie7.op下都可以正常显示,可是到了IE6的时候,这个绝对定位浮

关于IE6下绝对定位元素莫名消失的问题

一般来说,让绝对定位的元素不挨着浮动元素就OK了: 1.当绝对定位层的邻近浮动层的宽度不等于父层宽度时,以及没有清除浮动时,IE6/7,FF中显示一致: 2.当绝对定位层的邻近浮动层的宽度不等于父层宽度时,有清除浮动时,IE6/7不显示绝对定位层,FF显示: 3.当绝对定位层的邻近浮动层的宽度等于父层宽度时,以及没有清除浮动时,IE6不显示绝对定位层,IE7/FF显示: 4.当绝对定位层的邻近浮动层的宽度等于父层宽度时,有清除浮动时,IE6/7不显示绝对定位层,FF显示: 就目前来说我个人的解决

IE6下div层被select控件遮住的问题解决方法

Select在IE6下是处于最顶层的,因此想要遮住它,设置zIndex属性是不行的,就需要一个优先级更高的元素,就是iframe,当把iframe嵌套在弹出div层中后,把iframe设置为不可见,但它使弹出的div能浮于select等一些元素之上,因此完美解决了此问题,如下是需要弹出的Div代码,星号内代码为添加的iframe: <div id="quest"> <!--*******************************iframe***********

IE6下iframe内容不显示bug

最近项目中,一个页面 page_a.html 中包含一个 iframe,它的 src 属性指向 page_b.html, 在IE7, 8 & Firefox 中均能正常显示,但是在 IE6 下面 iframe 显示空白(假如在 iframe 区域右键刷新,则能显示 page_b.html 页面内容),而使用 IE6 单独打开 page_b.html 则显示正常.甚是奇怪. 通过 google, 找到一篇文章:http://blog.sina.com.cn/s/blog_473491a40100g

IE6下绝对定位元素父级宽高是奇数,绝对定位元素的right和bottom值会有1个像素的偏差

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 .box{ 8 width: 308px; 9 height: 308px; 10 background-color: red; 11 position: absolute; 12 } 13 .content{ 14 wid

ie6下js更新元素display:block后,仍然不显示的hack办法

$hotGames.html(html).removeClass("hide").show();//代码执行到这里,在ie6下仍然无法正常显示 //只有执行了下边的两行代码后,才正常显示.if (isIE6 === true) { $hotGames.css({"position":"absolute"}); setTimeout(function(){$hotGames.css({"position":"stati

CSS在IE6下的一些BUG和兼容性问题

在IE6,7下面PNG图片问题: 在IE6下,不支持PNG透明图片,解决办法是:在HTML里加上以下一段代码,其中DD_belatedPNG_0.0.8a.js文件可以在百度上找到,DD_belatedPNG_0.0.8a.js是国外一个大神写的JS文件. <!--[if IE 6]> <script src="js/DD_belatedPNG_0.0.8a.js"></script> <script> DD_belatedPNG.fix

ie6下兼容问题

最小高度问题:overflow:hidden 在ie6.7下 li本身不浮动 内容浮动 li产生3像素间隙 解决:vertical-align:top; 二.当ie6下最小高度问题和li间隙问题共存时 给li加浮动 滤镜:标准浏览器[opacity:0.5] ie6[filter:alpha(opacity=50)] 图片底部3像素问题:vertical-align:top; padding是占位置的. ie6下 子元素会撑开父级设置好的宽高  : 计算一定要正确,不要让内容的宽高,超出设置的宽

IE6下CSS常见兼容性问题及解决方案

1. 在IE6元素浮动,如果宽度需要内容撑开,就给里面的块元素加浮动. 2. IE6下最小高度问题:在IE6下元素高度小于19px的时候,会被当作19px处理.解决方案:给元素加 overflow:hidden. 3. border:1px dotted #000: 1px dotted 在IE6下不支持 解决方案:切背景平铺 4. margin传递:解决方案:a.父级或自己浮动; b.给元素加 overflow:hidden;zoom:1; 5. 在IE6下父级有边框的时候,子元素的margi