1

这是我的网站，因此您可以看到问题：网页

问题是我的.footer Has a margin: 50px 0 50px 0;，但由于某种原因，它似乎没有距离顶部 50px 的边距。我不明白是什么导致了问题。

这是页脚部分的完整css（.dashed-footer基本上是带有虚线边框的页脚内部部分。）

CSS

.footer {
    margin: 50px 0 50px 0;
    background-color: #1d130e;
    width: 100%;
    min-width: 1000px;
    height: 50px;
    border-top: 1px solid #0d0907;
    border-bottom: 1px soid #0d0907;
    clear: both;

    -webkit-box-shadow: 0px 0px 15px -1px #181513;
    box-shadow: 0px 0px 15px -1px #181513;
}

.dashed-footer {
    height: 37px;
    margin-top: 5px;
    text-align: center;
    line-height: 38px;
    border-top: 1px dashed #613e27 !important;
    border-bottom: 1px dashed #613e27 !important;
    color: #e6d7bb;
    text-shadow: 1px 1px 0 #000;
}
4

2 回答 2

4 
overflow: hidden;

就是section.content答案。这是因为其中的元素是浮动的，这使它们脱离了文档的正常流程。

于 2012-08-26T12:50:41.303 回答
2

我认为这是因为应用了边距，从 50px 向下<section id="content">，但由于某种原因，三重奏被放置在该部分之外，并将页脚向下推！如果您选择“检查元素”并将鼠标悬停<section id="content">在幻灯片的下方，您会看到它停在幻灯片的下方，而三重奏则在下方。我认为解决方案是margin: [height of trio plus margins, borders, etc] + 50px 0 50px 0;

于 2012-08-26T12:56:36.577 回答