當設置底部CSS屬性時，CSS溢出滾動條位置錯誤

我有一個div，其頁腳圖像佔用26px的空間。 CSS被設置爲在需要時顯示垂直滾動條，但是我需要確保滾動條不會重疊到我的頁腳區域，所以我使用bottom:26px;來提醒它。當這種情況發生時，雖然滾動條向上移動，我看不到內容的頂部或滾動條的頂部箭頭。我不知道該如何修改css來修復它，以便滾動條位於頂部，並在底部爲我的圖像留出26px的間距。任何幫助表示讚賞。當設置底部CSS屬性時，CSS溢出滾動條位置錯誤

HTML

<div id="channel-container"> 
<div id="channel"> 

</div></div>

CSS

#channel { 
color: #FFFFFF; 
text-align: left; 
width: 100%; 
height: 100%; 
overflow-x: hidden; 
overflow-y: auto; 
position: absolute; 
bottom: 26px; 
} 
#channel-container { 
float: right; 
width: 31%; 
height: 100%; 
}

來源

2011-09-08 Ed R

想想重組你的HTML。如果div應該滾動，但頁腳不是那麼我不會將它們分組在一起。在頁腳上將邊距/填充設置爲0，對於scrollablediv的底部設置相同的邊距/填充。他們應該無縫混合在一起。也避免了使用位置絕對值和底部值的需要。

這是我認爲你在追求什麼的小提琴。 http://jsfiddle.net/vdZ6R/

<div id="container"> 
    <div id="scrollablediv"></div> 
    <div id="footer"><img src="" /></div> 
</div>

來源

2011-09-08 05:56:13 mrtsherman

這樣做是可以的，但我需要滾動DIV有100％的高度減去頁腳大小（26px），所以如果用戶改變他們的瀏覽器將是液體。 –

我真的不明白你想要什麼。你可以張貼圖片嗎？ – mrtsherman

http://img694.imageshack.us/img694/5341/100percentexample.png右側，jQuery按鈕「Channel，Friends，Clan」是我的頁腳。可滾動部分上方的內容區域。它需要是瀏覽器的高度減去底部的26px。因此無論瀏覽器的大小如何，它都會以100％減去那些26px（從底部）滾動。這有助於解決問題嗎？如果需要，我會盡力解釋。 –

當設置底部CSS屬性時，CSS溢出滾動條位置錯誤

回答

相關問題