Question

我的页脚有问题，我确信我错过的内容应该是非常明显但我已经玩了很长时间并且没有取得进展。

我的问题是内容部分位于我的页脚下面而不是将其推下来。

以下是两个重叠的对象。

#footer {
    margin: -40px auto 0;
    z-index: 9999;
    border-bottom: none;
    width: 75em;
    height: 3.333em;
    border: .0833em solid #DEDEDE;
    -moz-border-radius-topleft:26px;
    -moz-border-radius-topright:26px;
    -webkit-border-top-left-radius:26px;
    -webkit-border-top-right-radius:26px;
    -moz-box-shadow:0px 0px 20px #000000;
    -webkit-box-shadow:0px 0px 20px #000000;
    box-shadow:0px 0px 20px #000000;
}

#middle {
    width:75em;
    z-index: -1;
    margin:0em auto;
    padding: 15px 0 1.667em 0;
    height: 95%;
    position: relative;
    background-color: rgba(255, 255, 255, .30);
    -moz-border-radius:26px;
    -webkit-border-radius:26px;
    border-radius:26px;
    -moz-box-shadow:0px 0px 20px #000000;
    -webkit-box-shadow:0px 0px 20px #000000;
    box-shadow:0px 0px 20px #000000;
}

Answer 1

如果我理解您正在尝试正确执行的操作，那么您正试图阻止页脚与“中间”元素重叠。

看看：

margin: -40px auto 0;

如果将其更改为

margin: 40px auto 0;

删除减号会将页脚向南移动。您可以调整确切的长度，但我认为这是主要问题，并且经过测试可以将页脚向下移动。

CSS页脚定位溢出问题

1 个答案: