CSS頁腳定位溢出問題

Question

我遇到了我的頁腳問題，我相信我錯過了一些應該很明顯的東西，但是我一直在玩它太久而且沒有取得進展。

我的問題是內容部分在腳註下方，而不是按下。

Replicated issue

這裏是重疊的兩個對象。

#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; 

卸下減號移動你的頁腳南部。您可以調整確切的長度，但我認爲這是主要問題，並且測試可以將頁腳向下移動。