固定位置忽略父項？

我上滾動交替position: absolute和position:fixed之間的DIV，你可以看到我的斷碼這裏（的jsfiddle）：http://jsfiddle.net/g9NVj/2/固定位置忽略父項？

有問題的區域是粉紅色的，當你滾動變色的藍色框。正確的寬度和位置（以及我想要的結果）是粉色的盒子，藍色是破碎的。藍色框（.fix）更改爲position:fixed，似乎擁抱窗口的左側，並獲得不同的寬度（菜單側邊欄後面），而不是使用其父項。

我已經嘗試添加位置：相對於父，但它不能解決問題。

這裏是小提琴的關鍵領域的一個片段，但檢查的jsfiddle爲全碼：

.content { 
    width: 100%; 
    overflow: hidden; 
    position: relative; 
    border-bottom: 1px solid #CCD5D5; 
} 

.c-2 { 
    width: 50%; 
    min-height:1px; 
    float:left; 
    overflow: hidden; 
    /*position: relative; TRIED THIS BUT DOESN"T WORK */ 
} 

.c-2.last { 
    padding: 80px; 
} 

.sticky { 
    z-index: -1; 
    background: #e4f; 
} 

.fix { 
    position:fixed; 
    width:50%; 
    top: 0; 
    left: 0; 
    background: #34e; 
} 

.abs { 
    position:absolute; 
    bottom:0; 
    width:50%; 
    left:0; 
    background: #e4f; 
}

來源

2013-11-04 egr103

可能重複的[固定位置，但相對於容器]（http://stackoverflow.com/questions/6794000/fixed-position-but-relative-to-container） – Asenar

這是因爲position:fixed是相對於瀏覽器的窗口，所以加入position:relative父div沒有幫助您。如果你想.fixdiv相對於父div，你應該給它一個position:absolute和父div a position:relative。

來源

2013-11-04 11:05:17 BoBro

但這並不讓我的div固定在地方雖然......？ – egr103

固定位置忽略父項？

回答

相關問題