用於溢出內容的滾動條，佔據100％高度的固定位置邊欄的一部分

這部分是Scroll part of content in fixed position container的副本，但有一些限制以及問題始終沒有得到充分解答。用於溢出內容的滾動條，佔據100％高度的固定位置邊欄的一部分

我具有固定的位置欄是100％的高度（我想這可以是具有頂部0底部絕對位置0）

有許多元素的該佔用邊欄的第一部分，然後用戶內容標籤（基本上是用戶可以保存鏈接的區域）。可以添加和刪除邊欄第一部分中的元素，以便用戶內容的垂直起始位置可變。用戶內容本身可以在標籤內容中包含任意數量的鏈接，因此標籤內容可能比側邊欄的其餘部分佔用更多高度。當它這樣做時，我想要一個滾動條出現在選項卡內容區域以滾動瀏覽所有鏈接。

演示頁可以在這裏看到：http://protobrewui.meteor.com/

非常密切類似的是，谷歌在Gmail確實如下面的圖像中的同樣的事情。

Gmail

谷歌可以使用JavaScript或純CSS做。純粹的CSS解決方案將是可取的，但JavaScript也是我的有效選擇。

一些更多的信息：

我不希望整個側邊欄滾動，只有選項卡的內容，如果它溢出的頁面
如果我有沒有上面的標籤內容我變量要素也許能夠忍受這一點。
標籤內容應能佔據滾動所以給人的標籤內容固定的高度之前，任何高度保持在瀏覽器窗口中是不太什麼即時尋找

來源

2013-05-01 funkyeah

你可以用列表一個div並設置height並添加overflow: auto;

small demo

編輯：演示更新

來源

2013-05-01 23:05:42 Borian

與cl arify標籤內容中的鏈接應該能夠使用剩下的瀏覽器高度的100％，如gmail示例中所示。如果您將上述高度設置爲100％，則此解決方案不起作用。 – funkyeah 2013-05-02 04:33:29

它應該，如果你也設置父div的高度，請參閱更新的演示 – Borian 2013-05-02 11:20:22

好吧，我想我知道了，jsfiddle iframe扔我一個循環。我一直在看演示，並一直認爲這不會到瀏覽器的底部（所以它不是高度100％），但它是正確的iframe的底部，所以它也適用於我的情況呢？ – funkyeah 2013-05-03 06:00:07

用於溢出內容的滾動條，佔據100％高度的固定位置邊欄的一部分

回答

相關問題