如果定位相對於父項的固定元素不工作IE？

如果定位相對於父項的固定元素不工作Internet Explorer？我發現，當我定位一個元素固定，父母是否相對定位並不重要。它將相對於Internet Explorer中的窗口定位。如果定位相對於父項的固定元素不工作IE？

驗證碼：

// Content DIV 
 
.row { 
 
    width: 1200px; 
 
    margin: 0 auto; 
 
    vertical-align: top; 
 
    text-align: center; 
 
    font-size: 0; 
 
    position: relative; 
 
} 
 
// Call Action DIv 
 
.CallActionR { 
 
    position: relative; 
 
} 
 
.CallActionA { 
 
    position: absolute; 
 
    right: 0; 
 
} 
 
.CallActionContainer { 
 
    position: fixed; 
 
    z-index: 9999; 
 
    opacity: 1; 
 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
 
    transform: translateZ(0px); 
 
    transition: all 2s linear; 
 
    right: 0; 
 
} 
 
.CallActionDisplay { 
 
    margin: 0px; 
 
    width: 200px; 
 
    height: 58px; 
 
    border: 0px none rgb(0, 0, 0); 
 
    background-color: rgba(59, 110, 142, 0.74902); 
 
    background-size: 100% 100%; 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    font-size: 12px; 
 
    font-weight: normal; 
 
    color: rgb(241, 241, 241); 
 
    text-decoration: none; 
 
    word-wrap: break-word; 
 
    white-space: normal; 
 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
 
    z-index: 9999; 
 
    padding: 18px 15px; 
 
    font-weight: 600; 
 
    position: fixed; 
 
    right: 0px; 
 
}

<div class="row"> 
 
    <div class="CallActionR"> 
 
    <div class="CallActionA"> 
 
     <div class="CallActionContainer"> 
 
     <div class="CallAction">Call TO Action</div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

的位置固定在其他瀏覽器如谷歌Chrome和Firefox正確對齊。但來到IE 11無法正常工作。固定的位置<div>未根據相對窗口對齊。

來源

2016-05-18 CodeMan

職位：固定只介意wiewport。 https://www.w3.org/wiki/CSS_absolute_and_fixed_positioning#Fixed_positioning –

*「我發現，當我定位一個元素固定的時候，父母是否相對定位並不重要，它的位置是固定的，相對於窗口「* - 這是預期的行爲。我懷疑任何瀏覽器會有什麼不同。 –

@Paulie_D：在IE中渲染與其他人不同，我沒有從我的代碼中發現任何問題。如果你發現有什麼需要的話 – CodeMan

我剛碰到同樣的問題。實際上除了IE以外，大多數瀏覽器（Firefox/Chrome）都在做我想做的事情，但事實證明這是錯誤的行爲。但是由於使用'變換'，它會'打破'位置：固定在IE中（不在其他瀏覽器中）。這導致IE和其他瀏覽器之間的行爲不同。

我的解釋可能不是很清楚，所以請閱讀http://tympanus.net/codrops/css_reference/position/（最後一段在Trivia &便籤）。

來源

2016-08-03 11:02:42 Rene

如果定位相對於父項的固定元素不工作IE？

回答

相關問題