Question

我设置了一个绝对的div位置：

left: 700px;

但是当我调整浏览器大小时，我的div当然不会移动。在调整窗口大小时，如何将其位置设置为向右浮动并向左移动？

要显示情况，请查看this site。查看图像滑块和右侧的箭头。它的风格：

#slides .next,#slides .prev {
    top:165px;
    left:-20px;
    width:24px;
    height:43px;
    display:block;
    z-index:999;

    position: absolute;
}

#slides .next {
    left: 700px;
}

现在尝试使用该滑块调整窗口大小。我的箭头将保持在相同的位置，但它应该向左移动滑块背景。

与float: right; right: 0px;等无关的任何内容均无效。

Answer 1

从left: -20px;移除#slides .next, #slides .prev（您可以将其移至.prev）
从left: 700px;

.next

将right: 0添加到.next。

瞧，你的.next将始终调整到#slides（position: relative}的右侧。

Answer 2

你可以使用“right：### px”来定位元素而不是左边？如果您需要将其完全定位在内容的右侧而不是窗口的右侧，请将其包装在容器中：

<div style="position:relative; width:900px; height:90px; margin:10px auto;">
    <p>Some arbitrary content.</p>
    <div style="position:absolute; top:20px; left:20px;">Absolutely positioned left content</div>
    <div style="position:absolute; top:20px; right:20px;">Absolutely positioned right content</div>
</div>

绝对的div位置 - 让它坚持到右边

2 个答案: