頁腳位置不變

Question

在 main 中的所有內容之后，如何讓我的頁腳位於容器的底部？

這是網站：（在主頁上很好，但在其他任何網站上都沒有）

Answer 1

這能解決你的問題嗎？

.footer { clear:both !important;}

Answer 2

從 .panels h6 中移除高度：200px。 它應該適合你。

Answer 3

您的布局存在一些問題。 您必須首先擺脫固定高度或盡可能增加它們。 這是有問題的規則：

.panels h6 {
  border-left: 1px dotted;
  border-top: 1px solid;
  font-family: verdana;
  font-size: 11px;
  height: 200px;
  /* height 200 px is less than the required height which should be ~244px */
  line-height: 1.3;
  padding: 10px;
}

下一步是可選的，但建議防止出現更多問題：在包含多個浮動元素的所有元素中，在所有浮動元素之后添加以下內容：

<div style="clear: both;"></div>

這將自動設置該元素的高度。

編輯 - -

設置.panels h6 { height: 200px; overflow-y: scroll; ... } .panels h6 { height: 200px; overflow-y: scroll; ... } .panels h6 { height: 200px; overflow-y: scroll; ... } . 然后使用 JavaScript 獲取並設置所有三列的高度等於最高列的高度。 您可以使用Element.getHeight( )和Element.setStyle( )等原型函數來執行此操作。

或者，谷歌“CSS Faux Columns”或“CSS Equal Height Columns”。

Answer 4

您要查找的內容稱為粘性頁腳。 谷歌一下，你會發現一堆不同的選擇。 這是我使用的鏈接文本

Answer 5

在主 div 上使用clearfix 。

Answer 6

我以前用 粘性頁腳來解決這個問題