CSS - 粘滯頁腳+補充工具欄問題

Question

我遇到了一些有關標題，內容，「粘滯」頁腳和側邊欄的網站的佈局問題。粘性頁腳，標題和內容組合本身並不是一個問題，但我不能爲我的生活弄清楚如何添加一個從標題直到頁腳的側欄，而不會搞亂「粘性」的「粘性」頁腳。

我接近它的方式現在涉及絕對定位。我基本上做了一個頭div（height: 71px; top: 0px;），一個頁腳div（bottom: 0px; height: 30px;）和一個內容div（top:71px;bottom:30px;）。然後，將側欄放在內容div中，並將其高度設置爲100％，然後在其旁邊添加另一個div（稱爲「視圖」）以獲取實際網站內容。這可以確保側欄從頂部到底部很好，頁腳通常位於頁面的底部。

但是，當窗口被調整大小時，這種方法會出現問題，特別是當內容太大而不適合「查看」div本身時。這會導致頁腳切斷內容，並且向下滾動會使頁腳在窗口中向上移動。我想實現一個頁腳，其行爲與this類似，但也有一個側欄，始終從頁眉的頁眉延伸到頁腳。

如果有人可以想辦法在上面鏈接的頁面上添加一個這樣的邊欄，或者對如何解決這個問題有任何想法，這將不勝感激。事先感謝。

Answer 1

您是否認爲除了div高度和定位之外，您還可以發佈一些HTML和CSS示例？

我在想的是你可以在邊欄<div>內再投入一個<div>，並將margin-bottom或padding-bottom設置爲30px。我會爲你工作一個jsFiddle。

Answer 2

你總是可以把overflow: auto放在你的view div上。

http://jsfiddle.net/dzRZd/

編輯：

有了固定的位置，而不是： http://jsfiddle.net/ekSvQ/2/