浮动图像与容器重叠。清除修复不起作用



我实际上已经尝试了几个小时以来我能找到的每一个 clearfix 黑客,但没有任何效果。右下角的铺路照片总是在内容容器之外。这是我目前拥有的:

.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; 
}

这是页面:网站模板

我已经尝试了clearfix hack和micro hack。我已将清除修复添加到内容类中。我试过溢出:隐藏|自动。我尝试添加清除:都在浮动元素之后。从字面上看,没有任何工作。

我已尽头。请帮忙!谢谢!

在我这边的FF上似乎很好,除了屏幕高度小于约791px时。我认为这是由于.outercontainer高度设置为 height:100% .