FF下div浮动导致外嵌套div不受控制的问题

1.如果内嵌div使用了浮动定位，在FF下（IE下可以显示撑大效果）将导致外部div不会受内部div影响而撑大，我在scriptygoddess找到了解决办法，就是使用一个清除格式的断点来使解决，原文内容：

When you float elements on your page they are taken out of the regular flow of your document. ie. they don't have width and heights when they are interacting with other elements. You can always add a break and clear after the 2 floated divs, and they will then make the container stretch in height to contain them eg.

< div id = " container " >
< div id = " float1 " >  sidebar  </ div >
< div id = " float2 " >  main text  </ div >
<br clear="all" />
</ div >  

 2.清除DIV浮动－使用:after (http://www.blueidea.com/tech/web/2005/3065.asp)

:after（伪对象）--设置在对象后发生的内容，通常和content配合使用，IE不支持此伪对象，非Ie 浏览器支持，所以并不影响到IE/WIN浏览器。
CSS

 

.wrapfix:after  ... {
    content: "."; 
    display: block;
    height: 0; 
    clear: both; 
    visibility: hidden;
}  

 

设display:block;应用到:after 元素，因为display的默认值是"inline", 不能收到clear的特性，同时将清除容器的高度设为零，height:0；，可见度为隐藏.这是没有清除过浮动的．非Ie 浏览器看不到wrap的背景和边框.