CSS絕對定位和滾動

我需要在頁面右下方放一個絕對div。CSS絕對定位和滾動

.absolute{ 
    position: absolute; 
    right:0; 
    bottom: 0; 
}

這個工作，但與頁面滾動右/底位置是不相對的身體寬度/高度，但相對可見區域（窗口）。

body{ 
    min-height: 600px; 
    min-width: 600px; 
}

我能解決這個問題的風格position:relative, width: 100%;包裹格但我失去了底部位置。

這是我想獲得：

Page absolute positioning

來源

2014-05-07 Tobia

使用'fixed'或'static'，而不是'absolute'。 –

http://jsfiddle.net/WCLwH/？ –

只需設置一個相對位置，你body元素：

body { 
    position: relative; 
}

因爲這樣你.absolute元素會相對於它而不是視口。

來源

2014-05-07 09:14:42 pzin

http://jsfiddle.net/WCLwH/1/

<body> 
    <div class="red"></div> 
    <div class="lime"></div> 
</body> 


<style type="text/css"> 
body { 
    position: relative; 
    border:solid 5px blue; 
} 
.red { 
    position:relative; 
    height:500px; 
    width:200px; 
    border:solid 5px red; 
} 
.lime { 
    position:absolute; 
    bottom:0px;right:0px; 
    width:250px;height:150px; 
    border:solid 5px lime; 
} 
</style>

，並有大量的「紅盒子」的內容，它看起來是這樣的：http://jsfiddle.net/WCLwH/2/

來源

2014-05-07 09:20:37 caramba

如果我在'.red'中添加'margin-bottom'並從** body **中刪除'border'，我會看到'.lime'的底部位置與'.red'相同。 * //對不起英語* **請看這裏：http://jsfiddle.net/7gqkj8km/** – Illuminator

CSS絕對定位和滾動

回答

相關問題