IE7/IE8 problema z-index

Question

In esecuzione in modalità di compatibilità il calendario sottostante esegue il rendering dietro le caselle di testo sottostanti. IE8 mostra il calendario come ne ho bisogno.

mio CSS

.MyCalendar .ajax__calendar_container 
{ 
border:1px solid #7F9DB9; 
background-color: #ffffff; 
z-index : 1004 ; 
width:190px; 
} 

le caselle di testo che vengono sovrapponendo il calendario non hanno il loro z-index impostato ovunque, anche se ho cercato nel mio codice lato server per impostare il loro z-index a -1 se io rilevare IE7 senza alcun risultato. Eventuali suggerimenti? alt text http://img62.imageshack.us/img62/7127/overlay.gif

Answer 1

IE ha problemi con z-index. La maggior parte dei browser trattano la pagina in un contesto stacking continuo, ma in IE, elementi posizionati generano un nuovo contesto di stratificazione, iniziando con un valore z-index 0.

Come accennato in questo articolo:

http://trwa.ca/2012/03/ie-z-index-bug-and-how-to-squash-it/

prova a dare all'elemento padre del calendario uno z-index ancora più alto.

Answer 2

Ho finalmente ottenuto in alto con un'immagine di sfondo trasparente aggiuntiva. IE8. SASS:

#galerie-link { 
    position: absolute; 
    z-index: 1000; 
    top: 25px; 
    left: 40px; 
    a { 
     display: block; 
     width: 185px; 
     height: 90px; 
     background-image: url(../images/transparent.png); 
    } 
    }