Div不能全高

Question

我正在建立一個非常小的wordpress主題。 我只是無法弄清楚為什么我的主包裝div無法達到應有的高度。 所以我的頁腳顯示在頁面中間，帶有或不帶有絕對位置。

在此先感謝您的幫助

Answer 1

這應該可以解決您的問題。

CSS：

對於主包裝：

.main-wrapper {
    width: 100%;
    height: 100%;
    margin: 95px 0px 0px 0px;
    padding: 0;
    overflow: visible;
    display: table;
}

對於頁腳：

footer {
    width: 100%;
    padding: 30px 0px 25px 0px;
    font-size: 13px;
}

Answer 2

如果希望頁腳始終顯示在屏幕底部，請將頁腳元素的CSS屬性從position:absolute更改為position:fixed 。

如果只希望頁腳顯示在文檔的底部，則刪除position: absolute頁腳元素的position: absolute和height:100%正文元素的height:100% 。

將頁腳設置為position:absolute情況下，頁腳顯示在頁面中間的原因是，頁腳的包含塊是由最近的祖先建立的，其“位置”為“絕對”，“相對”或“固定”，因為沒有這樣的祖先，所以包含塊是視口，因此當您向上滾動頁面時，頁腳將顯示在頁面中間。