上代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>css 清除浮动 兼容IE+, FF</title>
<style type="text/css">
.clearfix {
  *zoom;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height;
}
.clearfix:after {
  clear: both;
}
.fl {
    float: left;
}
.box {
    border: 1px solid #F00;
    width: 320px;
    height: 150px;
    margin: 5px;
}

</style>
</head>

<body>
<div class="clearfix" style="border:1px solid #00F;">
  <div class="fl box"></div>
  <div class="fl box"></div>
</div>
<div class="box"></div>
</body>
</html>

css 清除浮动 兼容IE+, FF的更多相关文章

  1. 【转】css清除浮动float的三种方法总结，为什么清浮动？浮动会有那些影响？

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...

  2. css清除浮动float的几种方法

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 这里我没有给最外层的DIV.outer 设置高度, ...

  3. css清除浮动的方法汇总

    这是在其他地方看到的一篇文章,汇总的不错,摘过来做个记录. 引用地址 : http://www.cnblogs.com/ForEvErNoME/p/3383539.html ------------- ...

  4. css清除浮动定位造成的异常

    清除浮动是为了解决高度塌陷的问题:内层有好几个div有宽有高,并且选择了浮动定位,但是外层的div却并没有设置宽高.在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动( ...

  5. 【转】CSS清除浮动_清除float浮动

    CSS清除浮动方法集合 一.浮动产生原因 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 浮动产生样式效果截图 ...

  6. 什么是CSS清除浮动？

    在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外 ...

  7. CSS清除浮动的方法

    CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...

  8. CSS清除浮动各种方法

    当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象.这个现 ...

  9. css清除浮动float

    css清除浮动float 1.分析HTML代码 <div class="outer"> <div class="div1">1</ ...

随机推荐

  1. 线程-run和start

    import java.lang.Thread; class Machine extends Thread{ public void run() { int a ; for( a = 0 ; a &l ...

  2. 又优化了一下 Android ListView 异步加载图片

    写这篇文章并不是教大家怎么样用listview异步加载图片,因为这样的文章在网上已经有很多了,比如这位仁兄写的就很好: http://www.iteye.com/topic/685986 我也是因为看 ...

  3. css案例学习之层叠样式

    代码 <html> <head> <title>层叠特性</title> <style type="text/css"> ...

  4. MAC 下使用ipv6、ipv4观看电视、网络电视

      换了mac book,ipv6电视却看不了了,为了看电视,只要自己动手了. 关于ipv6是啥和哪里有ipv6这里就不说了,找度娘吧. 我们观看IPv6视频直播信号有两种,一种是mms协议,另外一种 ...

  5. 成都UBER优步司机第六组奖励政策

    保底时段详解 滴滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs. ...

  6. 《C语言深度剖析》学习笔记----C语言中的符号

    本节主要讲C语言中的各种符号,包括注释符.单引号双信号以及逻辑运算符等. 一.注释符 注释符号和注释在程序的预编译期就已经被解决了,在预编译期间,编译器会将注释符号和注释符号之间的部分简单的替换成为空 ...

  7. 全国计算机等级考试二级教程-C语言程序设计_第8章_地址和指针

    面试: unsigned int *p1 = &num; int *p2 = &num; #define _CRT_SECURE_NO_WARNINGS #include<std ...

  8. android 常用调用系统功能

    1.从google搜索内容 Intent intent = new Intent(); intent.setAction(Intent.ACTION_WEB_SEARCH); intent.putEx ...

  9. UVA 103 Stacking Boxes 套箱子 DAG最长路 dp记忆化搜索

    题意:给出几个多维的箱子,如果箱子的每一边都小于另一个箱子的对应边,那就称这个箱子小于另一个箱子,然后要求能够套出的最多的箱子. 要注意的是关系图的构建,对箱子的边排序,如果分别都小于另一个箱子就说明 ...

  10. NET 人民币大写

    /***** HongShijin** Me@HongShijin.com** 2009-3-15 10:13:00.00000** text/C#***/ /// <summary> / ...