如何在可滚动区域中定位绝对？ （CSS）

Question

我有这个棘手的CSS问题：我有这个HTML和CSS：

.mark {
     height: 30px;
     width: 30px;
     background: red;
     position: absolute;
     left: 30px;
     bottom: 30px;
 }

http://jsfiddle.net/mr_mohsen_rasouli/4Nb9L/

我希望红色框留在定义位置但是当我滚动时，它会移动！ 我该如何解决？

Answer 1

试试这个..这可能不是一个好方法。 但是会给你想要的结果。

我将div mark放入另一个div 并给予

.mark {
    height: 30px;
    width: 30px;
    background:red;
    position: fixed;
} 

完整代码在这里
http://jsfiddle.net/4Nb9L/7/

Answer 2

你使用了绝对，使用固定而不是

.mark {
    height: 30px;
    width: 30px;
    background: red;
    position: fixed;
    left: 30px;
    bottom: 30px;
}

Answer 3

使用position : fixed和.mark元素的顶部参考

示例：

.mark {
    height: 30px;
    width: 30px;
    background: red;
    position: fixed;
    left: 30px;
    top:150px;
}

Answer 4

更改position属性的值而不是绝对值并尝试。

Answer 5

.mark {
height: 30px;
width: 30px;
background: red;
position: fixed;
left: 30px;
bottom: 30px;
}

链接：Updated Fiddle