html - 为什么固定的右列不在 Position Relative Div 内？

Question

请看我的 fiddle :http://jsfiddle.net/qVHg8/1/

为什么 fixedRightCol 没有定位在外部容器 div 的 right:0 处？现在它在我不想要的容器 div 之外。

我可以使用绝对位置，它将 fixedRightCol 放在正确的位置但会滚动。我希望修复 fixedRightCol(无滚动)。

那么我怎样才能正确获得 fixedRightCol 位置并固定在滚动条上呢？

谢谢

Answer 1

如果想让绿色div固定在红色div里面，需要使用position: absolute;

http://jsfiddle.net/qVHg8/2/

position: fixed; 将元素固定到视口(viewport)，而不是父元素。

编辑:

如果您能够使用一些 javascript 和 jQuery，那么这将适用于您的动态边距:

$(function(){
    $('.fixedRightCol').css({right:  $('.container').offset().left});
});

所做的是将 right CSS 属性设置为容器的计算 left 属性。由于两边的边距相同(自动)，因此这会将红色 div 拉到正确的位置。

http://jsfiddle.net/qVHg8/4/是这方面的一个工作示例。