一个老外弄的Clearingfloats(清除浮动的方法)

网络编程 CSS/HTML 经验交流 分类:[default] 更新日期: 2016-06-02

我常用的都是clear:both;方法,如
<div style="clear:both">
   <div style="float:left"></div>
  <div style="float:right"></div>
</div>
今在PlanABC看到另外这种方法,特些记录下来。
div.container {
 border: 1px solid #000000;
}
div.left {
 width: 45%;
 float: left;
}
div.right {
 width: 45%;
 float: right;
}
层套关系:container的div包含left和right
最简单合理的清除浮动的方法(红色粗体部分):
div.container {
 border: 1px solid #000000;
 overflow: hidden;
 width: 100%;
}
兼容情况:IE6 IE7 FF MacIE等
来源地址:http://www.quirksmode.org/css/clearing.html
PS:不过在使用的过程貌似还有小的BUG,淘宝的小马曾碰到过,具体的症状是,IE6中层套清除浮动的div,导致部分链接无法点击。

> 本站内容系网友提交或本网编辑转载,其目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请及时与本网联系,我们将在第一时间删除内容!

相关文章
  • php好代码风格的阶段性总结
    这篇文章主要介绍了php好代码风格,阶段性总结了php程序设计中变量.函数.参数的相关使用注意事项与编程技巧,具有一定参考借鉴价值,需要的朋友可以参考下本文总结了php好代码的风格,分享给大家供大家参考,具体如下: 1.避免使用魔数 if($age<18){ } 这个18不太明白为什么要这样子. 可以将28定义在一个变量里面,这个变量命名表明了这个值的 ...
  • 将xml文件作为一个小的数据库,进行学生的增删改查的简单实例
    下面小编就为大家带来一篇将xml文件作为一个小的数据库,进行学生的增删改查的简单实例.小编觉得挺不错的,现在就分享给大家,也给大家做个参考.一起跟随小编过来看看吧1.xml文件: <?xml version="1.0" encoding="UTF-8"?><Students> <stude ...
  • Web2.0编程思想:16条法则
    1.在你开始之前,先定一个简单的目标.无论你是一个Web 2.0应用的创建者还是用户,请清晰的构思你的目标.就像"我需要保存一个书签"或者"我准备帮助人们创建可编辑的.共享的页面"这样的目标,让你保持最基础的需求.很多Web 2.0应用的最初吸引之处就是它的简单,避免并隐藏了那些多余的复杂性.站在创建者的立场,可以想象 ...
  • Swift中内置的集合类型学习笔记
    Swift中内置的集合类型学习笔记
    Swift中自带数组.set.字典三大集合类型,这里将学习过程中的基础的Swift中内置的集合类型学习笔记进行整理,需要的朋友可以参考下一.引言 Swift中提供了3种集合类型,Array数据类型,Set集合类型,Dictionary字典类型.Array用于存放一组有序的数据,数据角标从0开始一次递增:Set用于存放一组无序的数据,数据不可以重复:Dicti ...
  • PHP微信开发之查询城市天气
    PHP微信开发之查询城市天气
    这篇文章主要为大家详细介绍了PHP微信开发之简单实现查询城市天气的相关资料,感兴趣的小伙伴们可以参考一下PHP微信查询城市天气,首先,你需要找到一个获取天气的API,此处,我用的是百度的apistore,申请和使用API的网址:http://apistore.baidu.com/apiworks/servicedetail/112.html  登录百度账号, ...
  • MongoDB的Master-Slave主从模式配置及主从复制要点解析
    主从复制是数据库运维中一种常见的备份方式,这里我们来看一下MongoDB的Master-Slave主从模式配置及主从复制要点解析,需要的朋友可以参考下主从配置mongodb的master-slave模式配置方式如下1.keyFile生成key_file openssl rand -base64 741 > mongo_key 将mongo_key 分别 ...
猜你喜欢