ie8 下div宽度为什么会变大。。。

发布网友 发布时间：2022-05-07 03:10

我来回答

共4个回答

热心网友 时间：2022-05-13 18:10

应该不是宽度变大，而是浏览器对样式的解析不一样，像你这里可能是下面几个问题：

1、先说边框boder；
小实验：有兴趣大家可以看看这段实验。在不同浏览器下分别测试以下各项代码。
a.<div style=”border:1px solid red;height:10px”></div>
b.<div style=”border:1px solid red;width:10px”></div>
c.<div style=”border:1px solid red;float:left”></div>
d.<div style=”border:1px solid red;overflow:hidden”></div>
上面的代码在不同浏览器中是不一样的，实验起源于对小height 值div 的运用，<div style=”height:10px;overflow:hidden”></div>，小height 值要配合overflow:hidden一起使用。实验好玩而已，想说明的是，浏览器对容器的边界解释是大不相同的，容器内容的影响结果各不相同。

2、最被痛恨的，double-margin bug。ie6下给浮动容器定义margin-left 或者margin-right 实际效果是数值的2倍。解决方案，给浮动容器定义display:inline。

3、给容器定义padding的实际效果是padding值加上所设定的宽度或者高度值；
例如：<div style=" width:100px; height:80px; padding:20px; background:red;"></div>
上面这个代码在浏览器中实际显示的宽度为140px，高度为120px，所以你如果想要实际宽度为100px高度为80px的话，那么你代码写的宽度就要为60px，高度为40px

给你分析了通常容易出现的问题，你自己分析一下你是哪个吧

热心网友 时间：2022-05-13 19:28

不会呀，你设定宽度单位是px了吗？一定要注意要有单位，，不然在IE8下会认为是百分比的

热心网友 时间：2022-05-13 21:03

在head标签中加入如下兼容性代码：<meta http-equiv="x-ua-compatible" content="ie=emulateie7" />

x-ua-compatible是针对ie8新加的一个设置，对于ie8之外的浏览器是不识别的，这个区别与content="ie=7"在无论页面是否包含指令，都像是使用了 windows internet explorer 7的标准模式。而content="ie=emulateie7"模式遵循指令。对于多数网站来说，它是首选的兼容性模式。

热心网友 时间：2022-05-13 22:54

升级IE9吧，IE浏览器里面IE8最扯，很多东西都得单独调！