天天看点

CSS中float引起层飘出上级层的解决方案,清除浮动的好方法

为了解决这个问题,从网上找到这篇文章:CSS的十八般技巧

其中第十三条提到解决方案,于是看到这篇:How To Clear Floats Without Structural Markup

解决方案好象比较麻烦,如下:

.clearfix:after {    content: ".";     display: block;     height: 0;     clear: both;     visibility: hidden;}.clearfix {display: inline-block;}* html .clearfix {height: 1%;}.clearfix {display: block;}

经我多次尝试,修改如下:

.clearfix {

    display: block;

    margin: 0px;

    clear: both;

    padding: 0px;

    visibility: hidden;

    background-color:#666666;

    border:0px none #FFFFFF;

}

.clearfix:after {

    height: 0px;

}

使用方法:

在所有浮动层之后加上这个层

 <div class="clearfix"></div>

在IE和FireFox测试OK,我想就够了,呵呵……

继续阅读