透明边距问题

这是我的CSS(简化版):

body {
    background: url('bg.gif') left top;
}
#content {
     background: #ddd;
}
.box {
    overflow: hidden;
    margin-top: 10px;
    background: #1e1e1e url('left-bottom-corner.gif') left bottom no-repeat;
}

和标记:

<div id="content">
    <div class="box">
        <p>lorem ipsum</p>
    </div>
</div>

现在问题来了。在.box有10px上边距的地方,content div的背景不可见,相反,主体的背景可见。

我不能使用填充,因为我需要设置.box分隔符的样式以具有圆形边框和它们自己的背景,所以我必须使用边距。

我怎样才能纠正这种不正确的行为?