博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
IE7下元素的 'padding-top' 遇到 'clear' 特性在某些情况下复制到 'padding-bottom'
阅读量:7030 次
发布时间:2019-06-28

本文共 526 字,大约阅读时间需要 1 分钟。

项目中使用的是DIV+CSS布局,有一个页面是同事完成的,这几天他请假有事。项目发现一个UI Bug。在IE7下,某一个Div的padding-top会让整个div产生padding-bottom样式。在IE8/9、Firefox、Chrome下都是OK。

 

通过搜索发现是发现问题的答案:

链接地址是:

在项目开发过程中,开发人员为了让div的高度随着内容自动增加,所以经常在div的关闭之前会添加一个类似clearfix的div。这个div的结构如下:

<div class=”clearfix”>&nbsp;</div> 样式是: .clearfix{clear: both;}。通过上面链接的解释是未触发hasLayout 特性。平时对这个特性接触的不多,所以不是很明白。

 

但是之前的项目我们也未采用链接所说的解决方案,但是项目的兼容性是很不错的。后来通过查看之前项目的代码,我们在给最外层的div添加一个高度时,padding-bottom样式不会出现。但是我们此时内容无法自动扩充。

 

所以在需要自动扩展内容的div中嵌入一个<div class=”clearfix”></div>,此时最外层不能添加height,达到内容自动扩充。代码如下:

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

转载地址:http://xcwal.baihongyu.com/

你可能感兴趣的文章
BloomFilter 原理,实现及优化
查看>>
PHP本地文件包含漏洞环境搭建与利用
查看>>
OGNL设计及使用不当造成的远程代码执行漏洞
查看>>
Vue-cli + express 构建的SPA Blog(采用前后端分离方案)
查看>>
ios中的多播委托
查看>>
Java基础-单例模式
查看>>
轻仿QQ音乐之音频歌词播放、锁屏歌词
查看>>
MongoDB 4.0 RC 版本强势登陆
查看>>
AliOS Things网络适配框架 - SAL
查看>>
iOS 客户端与服务端做时间同步
查看>>
多个请求统一更新界面
查看>>
illuminate/routing 源码分析之注册路由
查看>>
网易公共技术Java研发工程师面经(offer)
查看>>
说说如何在登录页实现生成验证码功能
查看>>
笔记-softmax、softmax loss
查看>>
FastDFS蛋疼的集群和负载均衡(六)之Nginx高可用集群
查看>>
C语言入门经典读书笔记----第十一章 结构化数据
查看>>
Apache Thrift系列详解(二) - 网络服务模型
查看>>
chrome devtools使用详解——Performance
查看>>
了解一下ES6: 解构赋值&字符串
查看>>