2010-08-21 10 views
6

Posiadanie dziwnego problemu w IE7. W wielu miejscach mam DIV, który ma pozycję: absolutną na liście (fałszywe dropdown), gdy za nią jest coś, co ma pozycję: względna pozycja względna pozycjonowana pokaże za pośrednictwem drugiego elementu div.pozycja: względne pojawianie się na pozycji: bezwzględna

relativly umieszczony element nie ma żadnego zestawu z-index, natomiast absolutnie umieszczony element (jeden chcę na górze) ma z-index 1000.

http://skitch.com/louiswalch/dub5h/microsoft-windows-vista

+1

możliwy duplikat [IE z-index względnego/bezwzględnego błędu na liście] (http://stackoverflow.com/questions/798482/ie-z-index-relative-absolute-bug-in-list) –

Odpowiedz

22

Podejrzewam, że” ve już go wypróbowałeś, ale ustaw pierwszy element na z-index na swoim względnie umieszczonym elemencie, który jest niższy niż pozycja absolutnie umieszczonego elementu z-index.

Jeśli to nie działa, musisz upewnić się, że oba elementy są w tym samym stacking context. W IE, gdy zastosujesz regułę CSS position do elementu, generuje on nowy kontekst układania w tym elemencie. Oznacza to, że indeks "z" będzie właściwie respektowany tylko w elementach potomnych tego elementu, a dzieci w innych kontekstach układania mogą mieć niższe wartości z-indeksów.

W twoim przypadku musisz umieścić listę rozwijaną i przycisk w tym samym kontekście stosu, aby zastosować indeks z2 do 2 elementów, które generują osobne konteksty stosowe.

+0

Ahh spot na, to jest problem. Problem polega na tym, że nie jestem pewien, czy mogę umieścić je w tym samym indeksie układania. Dzieje się to w innym miejscu na stronie, które ma bardziej złożony układ, a element z relatywnym pozycjonowaniem jest na zupełnie innym poziomie DOM. Próbowałem podarować przedmiot, który pojawia się na wskaźniku Z niższym niż powyższy element i nadal pokazuje. co oznacza "lub zastosowanie indeksu Z w 2 elementach, które generują osobne konteksty stosowe." –

+7

Chodzi o to, że musisz znaleźć 2 elementy rodzicielskie za pomocą zestawu 'position' (tworzą dwa osobne konteksty układania) i ustawić na nich' z-index'. Na przykład, jeśli twój przycisk jest zagnieżdżony w kontenerze o nazwie "# content", a twoje menu rozwijane znajduje się w '# header', możesz ustawić' #content {z-index: 1} i '#header {z-index: 2}' . Pod warunkiem, że '# header' i' # content' są w tym samym stosowym kontekście, rozwiąże to twój problem. – Pat

Powiązane problemy