上代码：

<!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. Servlet 浅谈(三)

    关于Session 关于http协议后面会有一系列文章专门介绍.这里就大概了解一下:首先需要知道一点:HTTP是无状态的. 什么是无状态呢? 客户与服务器建立连接.发出请求.得到响应.关闭连接.整个流 ...

  2. Ubuntu 12.04 下安装git

    ---恢复内容开始--- 1.安装build-essential. 列出Git相关包(git-core 和 git-doc)所以来的各个安装包并安装: sudo apt-get build-dep g ...

  3. putty修改编码

    在窗口标题上点击右键,选择 Change Settings... 在打开的配置窗口左边选择 Appearance,在右边点 Font settings 里面的 Change 按钮,选择好中文字体,比如 ...

  4. getActionBar()空指针异常

    网上的各种解决方案已经不少了,但是不适合于我的,谷歌一种新的解决方案 you can directly specify it in manifest file 1 2 3 4 <applicat ...

  5. PHP面试题之文件目录操作

    获取文件后缀,遍历目录层次 /** * 5种方式获取文件后缀名 * 这道题其实就是考函数substr() strrchr() array_pop() strrpos() strpos() strrev ...

  6. CSS自学笔记（16）:CSS3 用户界面

    CSS3中,也新增了一些关于用户界面的属性,这些属性可以重设元素或者盒子的尺寸.轮廓等等. 新增的部分属性的浏览器支持情况 属性 浏览器支持 resize IE Firefox Chrome Safa ...

  7. jQuery插入节点的方法

    注:摘自<锋利的jQuery(第二版)> append() 向每个匹配的元素内部追加内容:  HTML代码:<p>我想说:</p>jQuery代码:$(" ...

  8. C# 堆栈的数据结构 (二)

    堆栈是一种常用的数据结构,并且是线性表操作的子集,即操作受限的线性表.因此需要用到Clist 线性表类 public class CStack { private Clist m_List;//创建链 ...

  9. C++ typeid实现原理

    最近看了boost::any类源码,其实现主要依赖typeid操作符.很好奇这样实现的时间和空间开销有多大,决定探一下究竟. VS2008附带的type_info类只有头文件,没有源文件,声明如下: ...

  10. flex实现股票行情走势图

    原文 http://blog.csdn.net/shenjiancomputer/article/details/8051873 第一步: jsp:1 <%@page import=" ...