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绝对定位和滚动

回答

相关问题