讓我的div轉到頁面底部

Question

我從字面上嘗試了一切，以使其正常工作。 我已經閱讀了所有其他所有stackoverflow。 我正在嘗試使DIV一直走到頁面底部。 如您所見，在jsfiddle中（通過側面邊框）沒有。 它似乎停止在357px的高度（不是整個高度）上。 然后我發現我的div是主體的100％，因為即使我也指定應該是100％，主體也是357px。 什么都沒有，我不確定為什么。 在我以前的項目中，我從來沒有遇到過這個問題。 我只是指定了最小高度，當我添加更多內容時，div伴隨着最小高度。 但是這一次它由於某種原因而溢出。

html, body {background-color:#F6EBBA;height:100%;position:relative;}
#main-body{
  display:block;
  height:100% !important;
  margin-left:16%;
  margin-right:30%;
  border:1px solid #dead68;
  border-top:none;
  border-bottom:none;
  bottom:0}

http://jsfiddle.net/R96Lc/

我的網站上有更多內容，但是我不得不刪除不需要的js，css，並將html更改為，以便您可以看到我在說什么。

提前致謝。

Answer 1

現場演示

您可以在此處聲明最小高度：

html, body { background-color:#F6EBBA;
              min-height:100%;
              position:relative;
            }

Answer 2

從＃main-body選擇器中刪除高度聲明。

#main-body{
    display:block;
    margin-left:16%;
    margin-right:30%;
    border:1px solid #dead68;
    border-top:none;
    border-bottom:none;
}

工作提琴： http : //jsfiddle.net/EfrainReyes/5tS8y/1/

Answer 3

如果將高度更改為auto或者不定義高度，則它會自動包含div內的所有文本。 這是一個工作版本。 我還整理了您的代碼（只需單擊“ TidyUp”按鈕），使其可讀。

Answer 4

我剛剛玩過小提琴，但是改變了：

height:100% !important;

至

min-height:100% !important;

似乎解決了這個問題

新提琴： http : //jsfiddle.net/R96Lc/2/

Answer 5

你在宣布

bottom 0 

但是div不是絕對的，您也可以不聲明任何高度。