Zagnieżdżony elementem stałym nie działa w IE

Question

próbuję umieścić element fixed wewnątrz innego elementu fixed jak ten

<div class="wrapper-fixed"> 
    <div class="content"> 
     <div class="element-fixed"> 
      <p>I'm fixed in Chrome, FF</p> 
      <p>Why not in IE ?</p> 
     </div> 
    </div> 
</div> 

Kiedy przewijać stronę w Chrome i FF element-fixed pobyt fixed ale w IE przewija zbyt i myślę, że to nie powinno się zdarzyć, ponieważ element fixed znajduje się poza przepływem dokumentów.

Próbowałem wyciągnąć go z content, ale nie działał, wyciągając go z wrapper-fixed, ale robi to w moim przypadku, nie mogę.

HERE A JSFIDDLE podobna do mojej realnej sytuacji

Więc dlaczego tak się dzieje i jak to naprawić bez wyciągania go z wrapper-fixed

Dodawanie zdjęć do zilustrowania problemu:

---

Answer 1

Wariant 1

Zmień swoją pozycję otoki do absolutnego

.wrapper-fixed{ 
    position: absolute; 
    ... 

Fiddle - http://jsfiddle.net/za4hdmpf/

Opcji 2

nie będą odpowiednie, jak wymaga tego rozwiązania, które nie pociąga za sobą ściągnięcia elementu zamocowanego na stałe z opakowania.

Zmiana znaczników oraz dostosowanie pozycji do elementu utrwalonych

<div class="wrapper-fixed"> 
    <div class="content"> 
     <p>Content</p>   
     <p>Content 1</p>   
     <p>Content 2</p> 
     <p>Content 3</p>   
     <p>Content 4</p> 
     <p>Content 5</p>   
     <p>Content 6</p> 
     <p>Content 7</p> 
     <p>.</p> 
     <p>.</p> 
     <p>.</p> 
    </div> 
</div> 

<div class="element-fixed"> 
    <p>I'm fixed in Chrome, FF</p> 
    <p>Why not in IE ?</p> 
</div> 

CSS

.element-fixed{ 
    position: fixed; 
    width: 170px; 
    border-radius: 10px; 
    top: 70px; 
    left: 50%; 
    margin-left: -290px; 
    background-color: #fff; 
} 

Fiddle - http://jsfiddle.net/vuykwu76/