網站內容溢出到頁腳

http://jsfiddle.net/talmuda3/s9QyR/網站內容溢出到頁腳

footer { 
    margin-top: 1em; 
    width: 100%; 
    height: 20em; 
    position: relative; 
    bottom: 0; 
    left: 0; 
}

離線網站的佈局是棘手的。內容溢出到頁腳中。部分代碼如上所述。

如何調整內容以使頁腳保持在底部，並且內容在整個網站上延伸而不重疊頁腳。請溫柔。檢查克里斯Coyier的網站的任何提示 - 可能只是錯過了一些東西。誰能幫忙？

來源

2013-03-27 user2215323

您正在用top: 12em聲明推低文章。你應該給頁尾相同的屬性，這解決了問題：http://jsfiddle.net/s9QyR/1/

來源

2013-03-27 12:04:47

我認爲你必須等待15分鐘才能接受答案。 – gaynorvader 2013-03-27 12:12:17

好吧，我不知道:) – 2013-03-27 12:13:51

你還應該推腳註top:12em;，將頁腳添加到正確的位置。 demo

來源

2013-03-27 12:17:01

我覺得這是你追求的 - jsFiddle

article { 
    margin-top:12em; 
    width:80%; 
    height:100%; 
    margin-left: auto; 
    margin-right: auto; 
    margin-bottom: 3em; 
    padding: 1em; 
    z-index: 2; 
    background: transparent; 
    overflow: visible; 
} 

footer { 
    margin-top: 1em; 
    width: 100%; 
    height: 20em; 
}

看來，改變定位打破了你的元素的自然流動。

您可能想嘗試這種方法，以避免必須將所有東西放在一條線上。

來源

2013-03-27 14:56:07 apaul

你也有寬度：100％;'和'寬度：80％;'在你的文章上。 – apaul 2013-03-27 14:57:51

網站內容溢出到頁腳

回答

相關問題