如何应用clear来清除容器中的内部元素

Question

如何清除两者以包裹容器中的元素

JSFDDILE

.container{
     background:blue;

}
.box{
    float:left;
    width:75px;
    height:75px;
    margin:5px 5px;
    background:red;

}

.box:after{
    clear:both;
}

我希望盒子被容器翘曲！ 感谢

Answer 1

你可以这样做：

Fiddle

.container:after{
    clear:both;
    content: " ";
    display: block;     
}

或

删除float并使用display: inline-block

Fiddle

.box{    
    width:75px;
    height:75px;
    margin:5px 5px;
    background:red;
    display: inline-block;
}