zoom:1-hasLayout
在现代浏览器,如果子元素float,则父元素不会自动被撑开
#nofloatbox {
border: 1px solid #FF0000;
background: #CCC;
width:200px;
}
#floatbox {
float: left;
width: 100px;
height: 100px;
border: 1px solid #0000FF;
background: #00FF00;
}
</style>
如果给父元素加上overflow:hidden
#nofloatbox {
border: 1px solid #FF0000;
background: #CCC;
width:200px;
zoom:1;
overflow:hidden;
}
或者给最后一个子元素加上clear:both
#nofloatbox > div:nth-child(2){
clear:both;
}
都会有清除浮动的效果.
zoom:1是针对ie的属性,可以激活hasLayout属性,关于hasLayout
css 的渲染,haslayout 是一个非常有必要彻底弄清楚的概念。大多IE下的显示错误,就是源于
haslayout。如果它设置成了true,它就不得不去渲染它自己,因此元素不得不扩展去包含它的流出的内容。例如浮动或者很长很长的没有截断的单
词,如果haslayout没有被设置成true,那么元素得依靠某个祖先元素来渲染它。这就是很多的ie bugs诞生的地方。
#nofloatbox {
border: 1px solid #FF0000;
background: #CCC;
width:200px;
zoom:1;
/*overflow:hidden;*/
}
<body>
<div id="nofloatbox">
<div id="floatbox"></div>
<div></div>
</div>
zoom:1-hasLayout的更多相关文章
- zoom,zoom与haslayout的关系,zoom与transform: scale( )的区别
1.zoom:(缩放)
- IE浏览器bug罪魁祸首--hasLayout
IE浏览器一直都是前端程序员最头疼的,IE的表现与其他浏览器不同的原因之一就是,显示引擎使用一个称为布局(layout)的内部概念. 认识hasLayout--haslayout是Windows In ...
- IE下的haslayout特性
什么是hasLayout?hasLayout是IE特有的一个属性.很多的ie下的css bug都与其息息相关.在ie中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组织 ...
- [css] haslayout
原文:http://blog.sina.com.cn/s/blog_51048da701018o29.html IE的表现与其他浏览器不同的原因之一就是,显示引擎使用一个称为布局(layout)的内部 ...
- 那些年,我们被耍过的bug——haslayout
你被IE的bug耍过几次了? IE,这个令所有网站设计人员讨厌,但又不得不为它工作的浏览器.不论是6.7还是8,它们都有一个共同的渲染标准haslayout,所以haslayout 是一个非常有必要彻 ...
- CSS:haslayout知多少
我们都知道浏览器有bug,而IE的bug似乎比大多数浏览器都多.IE的表现与其他浏览器不同的原因之一就是,显示引擎使用一个称为布局(layout)的内部概念. 因为布局是专门针对显示引擎内部工作方 ...
- IE haslayout
我们都知道浏览器有bug,而IE的bug似乎比大多数浏览器都多.IE的表现与其他浏览器不同的原因之一就是,显示引擎使用一个称为布局(layout)的内部概念. 因为布局是专门针对显示引擎内部工作方 ...
- haslayout知多少
我们都知道浏览器有bug,而IE的bug似乎比大多数浏览器都多.IE的表现与其他浏览器不同的原因之一就是,显示引擎使用一个称为布局(layout)的内部概念. 因为布局是专门针对显示引擎内部工作方 ...
- 认识hasLayout——IE浏览器css bug的一大罪恶根源
原文地址:http://neverned.blog.163.com/blog/static/1265524200933021130561/ 什么是hasLayout?hasLayout是IE特有 ...
- 认识hasLayout——IE浏览器css bug的一大罪恶根源 (转)
认识hasLayout--IE浏览器css bug的一大罪恶根源 转 什么是hasLayout?hasLayout是IE特有的一个属性.很多的ie下的css bug都与其息息相关.在ie中,一个元素要 ...
随机推荐
- CentOS6.5 安装snort
本机CentOS6.5最大化安装,以下安装所需组件也是最大化安装之后仍需自己安装的. 1.安装libpcap与libpcap-devel yum -y install libpcap* 2.安装lib ...
- [转]makefile文件的编写规则及实例
http://xueqi.iteye.com/blog/1567866 1.一个简单的makefile例子 假设一个程序有两个文件file1.c,file2.c,每个文件都包含head.h,生 ...
- Android---->RelativeLayout相对对齐方式布局
main.xml应用布局分析 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout x ...
- 使用Pushlet将消息从服务器端推送到客户端
使用Pushlet来实现服务器端向客户端推送信息 1. 实现方式: 有两种实现方式: 1. 通过配置文件来实现定时的从服务器端向客户端推送信息 2. 通过API主动 ...
- HDU 3201 Build a Fence
水题 #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> us ...
- Codevs 5590 A+B 问题 超级版
5590 A+B 问题 超级版 时间限制: 1 s 空间限制: 1000 KB 题目等级 : 青铜 Bronze 题目描述 Description 不用+-*/%计算A+B 输入描述 Input De ...
- DataTable的名称要后设置
string sqldatabase = string.Format(dr["sql"].ToString(), drpat["PATIENT_ID"].ToS ...
- 微信小程序开发入门教程
做任何程序开发要首先找到其官方文档,微信小程序目前还在邀请内测阶段,目前官方放出了部分开发文档,经过笔者一天的查看和尝试,感觉文档并不全面,但是通过这些文档已经能够看出其大概面貌了.闲话不多说,我们先 ...
- hbase 第一篇
参考:http://www.jdon.com/38244 http://chuanwang66.iteye.com/blog/1683533
- Spring动态数据源的配置
Spring动态数据源 我们很多项目中业务都需要涉及到多个数据源,就是对不同的方法或者不同的包使用不同的数据源.最简单的做法就是直接在Java代码里面lookup需要的数据源,但是这种做法耦合性太高, ...