CSS-如何定位:绝对工作不是在所有100%的屏幕区域

Question

我的body是800px宽：

body {
width:800px;
margin:15px auto;}

我有一个<div>区域（100x200px），应该在机身的右上角，无论是什么屏幕或浏览器打开它

#login-hover-cont{width:210px;padding:20px;position:absolute;right:0px;_right:-1px;top:30px;z-index:3;background:#fff}

它将div放在屏幕的右上角，这是错误的——我希望它位于BODY的右边框所在的位置。我该怎么做？不要想使用"position:relative"。

Answer 1

将body更改为此。

body 
{
    width: 800px;
    margin: 15px auto;
    position: relative;
}

你的div将在身体内部，并具有类似的风格。

#login-hover-cont
{
    ...
    position: absolute;
    top: 30px;
    right: 0px;
}

您需要这样做，因为绝对定位将始终相对于最接近定位祖先的元素。

Answer 2

我不会让主体宽度为800px，将其保留为自动宽度，并在绝对定位的主体周围放置一个容器div。给容器一个800px的宽度和一个postion:relative样式定义。绝对位置是相对于你的容器分区。

这是的工作样品

http://jsfiddle.net/5a6Fu/