重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
这篇文章给大家分享的是有关IE8下DIV嵌套出现错误怎么办的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
在南阳等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供网站设计、成都网站建设 网站设计制作按需网站开发,公司网站建设,企业网站建设,品牌网站制作,营销型网站,外贸营销网站建设,南阳网站建设费用合理。
IE8下DIV嵌套出现错误解决方案
最近用DIV写了几个网页,一开始呢,从来没有在IE8下面测试过,最近升级了IE8,发现了好些问题,一开始用IE6和IE7都没有的新问题出现了,大概就是以下的三种方法,与君共勉!
当b1和b2都是float=left时候,a1层的高度不会被b1和b2的高度撑开。(这个现象只有IE8发生,其他版本IE以及IE8选择兼容模式后就没有问题。)
解决方法:a1的display=table
=================================
不同的浏览器对CSS的解析可能存在出入,因此能在IE6和IE7正常显示的CSS+DIV页面在IE8和FF(即Firefox)浏览器中未必正常,需要格外留意。以下代码在FF和IE8下无法正常显示出DIV块的内容,仅有一条两个像素高度的红线(其实是上、下边框挤在一处的结果)——
CSS:
#main{ margin:auto; width:400px; background-color:#336699; border:1pxsolid#ff0000; } DIV:
IE8和FF浏览环境下的DIV嵌套效果:
这意味着,当我们把main作为DIV的父层,里面嵌套若干子层的DIV时,父层的样式将是被忽略的或者根本就是无效的,这将可能发生严重的问题。我们必须找出原因。原来,在IE8和FF环境下,一个没有任何内容的不定义高度的DIV是不会显示的。以上代码中,我们若给main定义一个高度,或将
嵌套DIV之后情形又如何呢?
里层的DIV是否被IE8和FF视为实体HTML元素?现在我们就来试验一下DIV嵌套效果:
CSS:
#main{ margin:auto; width:400px; background-color:#336699; border:1pxsolid#ff0000; } #sub{ width:200px; background-color:#aaa; float:left; } DIV:HelloWorld!
HiGod!
在IE8和FF下的DIV嵌套效果如下图所示:
显然,id为main的父层DIV嵌套没有被id为sub的里层子DIV撑高,整体样式出现严重的走样效果。一个简便的处理方法是,在***一个子层DIV结束之后加上一个高度为0像素的DIV,且该DIV不允许两边有浮动对象:
HelloWorld!
HiGod!
OK?
第二种解决方法是定义一个CSS类:
.box:after{ content:"."; display:block; height:0px; clear:both; visibility:hidden; }
然后将父层DIV代码中的
以上两种方法都将出现如下图所示的DIV嵌套效果:
感谢各位的阅读!关于“IE8下DIV嵌套出现错误怎么办”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!