浮动图像与容器重叠。 Clearfix还没有奏效

Question

我确实在尝试每个clearfix hack，我可以找到几个小时，但没有任何工作。右下方的铺贴照片始终位于内容容器之外。这就是我现在所拥有的：

.content {
    margin: -10px auto 10px;
    padding: 10px;
    }

#paving_photo {
    float: right;
    margin: 10px 0 10px 10px;
    border: 2px solid black;
    width: 300px;
    height: 300px;
}

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

这是页面：website template

我已经尝试过clearfix hack和micro hack。我已将clearfix添加到内容类。我试过overflow：hidden | auto。我试过添加clear：都是浮动元素之后。字面上没什么可行的。

我的智慧结束了。请帮忙！ 谢谢！

Answer 1

我的FF上看起来很好，除了屏幕高度小于791px。我认为这是由于.outercontainer高度设置为height:100%。