iframe中内嵌div的width为100%出现的不兼容现象
来源:互联网 发布:储存卡损坏数据恢复 编辑:程序博客网 时间:2024/05/22 08:01
今天发现,一个内嵌在iframe中的div,当样式宽度设置为width=100%时,出现ff和ie不兼容的情况。
ff中这个div宽度超过iframe的宽度
而ie中这个div宽度不足iframe的宽度
经过百度,发现是因为不同浏览器中width=100%有不同的定义。
ff中width=100%是整个iframe的外部宽度,也就是iframe宽度为多少,div宽度也是多少,不考虑iframe的滚动条。
ie中width=100%是iframe的内部宽度,是iframe的宽度-滚动条的宽度(不管有没有出现滚动条)。一般来说,滚动条的宽度占了总宽度的2%,所以在这种情况下,div的实际宽度只有iframe的98%
此外,如果仅是这样,那么ff下的iframe不应该出现滚动条,而实际情况是div的宽度超过iframe,这又是另外一个原因导致的:offsetWidth。
offsetWidth = width + padding + border。
css样式中的width设置为100%,如果这时设置了padding或border的话,那么实际显示出来的宽度就超过父元素的宽度,所以在ff下就出现div的宽度超过iframe宽度的情况。
解决方法:设置iframe的scrolling='no' ;取消div的border和padding样式
0 0
- iframe中内嵌div的width为100%出现的不兼容现象
- 关于max-width:100% 不兼容的问题
- min-width 不兼容ie6的解决办法
- vc打开出现不兼容现象怎么办
- chrome浏览器对iframe出现的怪现象!
- js操作iframe的div移动 | 兼容FF+IE
- 使用css设置的style.width ,alert(div.style.width);打印为空
- mysql 5.5.28 DIV整除 date取日期 ifnull为空判读 一起使用出现的奇葩现象
- jquery 获取 DIV的width
- min-width、max-width兼容IE6、IE7的解决方法
- iframe框架高度自适应在兼容模式下(ie7)不兼容的解决方法
- iframe背景色为父DIV的方法
- 关于firefox不兼容DIV嵌套的问题
- iframe的height自动调整,不出现滚动条
- iframe在IE下出现进度条不完整的解决方法
- 用CSS+DIV时width的问题
- div的width和height属性
- javascript获取div的width、height
- HDMI热插拔检测原理
- Samba服务器配置 smb.conf
- 1Z0-051 QUESTION 16 Q操作符的使用
- This system is not registered with RHN
- mysql sql语句大全
- iframe中内嵌div的width为100%出现的不兼容现象
- angular学习笔记二
- org.hibernate.usertype
- public boolean isMutable
- linux 字符设备驱动框架
- 判断一个图是否有环 无向图 有向图
- Address类的映射
- 建立WIN32 DLL,并使用静态加载和动态加载
- 讯飞云语音-语音合成常用参数配置