如何保持div在屏幕左侧，而不管屏幕大小

Question

我目前在一个网站上工作，该网站在某个位置使用滑块，但我需要将左侧箭头连接到屏幕左侧，而不是滑块内的常规箭头(用于滑块导航的左右箭头(，无论屏幕大小如何，右箭头也是如此。它目前只适用于我的屏幕尺寸(1366x768(，代码为

.bx-prev {
margin-left:-16.2%;
position:absolute;
margin-top:-200px;
}
.bx-next{
margin-left:86.2%;
position:absolute;
margin-top:-200px;
}

如有任何帮助，我们将不胜感激。此外，如果它能在Javascript/jQuery中做得最好，我也对此持开放态度。

Answer 1

您需要将position:relative添加到父元素，然后才能使用position:absolute；与父元素相关

.bx-prev {
position:absolute;
top:200px;
left: 0px;
    height:10px;
    width:10px;
    background:lime;
}
.bx-next{
    top:200px;
 height:10px;
    width:10px;
    background:lime;
position:absolute;
right: 0px;
}
.slider{
position:relative;
    width:500px;
        height:500px;
    background:red;
}   
<div class="slider">
    <div class="bx-next"></div>
    <div class="bx-prev"></div>
</div>

样本

Answer 2

您使用的是绝对定位，因此可以执行以下操作：

.bx-prev {
margin-left:-16.2%;
position:absolute;
margin-top:-200px;
left: 0px;
}
.bx-next{
margin-left:86.2%;
position:absolute;
margin-top:-200px;
right: 0px;
}

Answer 3

绝对定位将元素从其容器中取出，并允许您使用top/bottom/left/right将其自由定位在文档上。

这里有一个jsfiddle，它在标记中的a中显示了b，但我已经将它放在了最左边。这与右侧的c相同。

http://jsfiddle.net/w2CsF/1/

Answer 4

position: fixed;

是你问题的答案。