strato di ciclo IE7

Question

Ho un problema con una piccola div che dovrebbe "hover" sopra le foto che i sensori usando il plugin ciclo JQuery. Le immagini sono 950 px di larghezza e sulla destra in cima alle immagini una piccola scatola dovrebbe essere con le ultime notizie.

Il problema è che in modalità compatibilita in IE casella sembra perderlo di z-index e finisce dietro l'immagine. Funziona in IE8, Opera, Chrome e Firefox.

ho cercato di rimuovere le 2 immagini in modo che solo 1 immagine mostra, e poi per qualche motivo che funziona in compabilitymode pure. Ho cercato di togliere gli spazi bianchi tra le img-tag ma senza fortuna, margin: 0; padding: 0 in tutto, ma senza fortuna

Chiunque ha ottenuto tutte le idee che cosa potrebbe essere sbagliato?

codice CSS

#Content {
    width: 950px;   
}
#NewsWrapper {
    position: relative;
    padding: 0;
    margin: 0;
    top: 0;
}
#NewsListning {
    float: right;
    height: 200px;
    margin: 0;
    padding: 10px;
    background: yellow;
    top: 0;
    right: 0;
    position: absolute;
    z-index: 12;
    width: 300px;
}
#SlideImages {
    width: 100%;
    margin: 0; 
    padding: 0; 
    float: left; 
    z-index: 11;
}
.SlideImage {
    display: inline;
    float: left;
    padding: 0;
    margin: 0;
    z-index: 11;
}

Codice JavaScript

$(function () {
  $('#SlideImages').cycle({
    fx: 'fade',
    speed: 5000
  });
});

codice HTML

<div id="Content">
<div id="SlideImages">
    <img src="/Images/Slide1.jpg" class="SlideImage" />
    <img src="/Images/Slide2.jpg" class="SlideImage" />
    <img src="/Images/Slide3.jpg" class="SlideImage" />
</div>

<div id="NewsWrapper">
  <div id="NewsListning">
    <div>
      <strong>Test 2</strong> 
      Lorem ipsum
    </div>
  </div>
</div>

• RISOLTO - NOTE AGGIUNTIVE *

In tutti i browser, ma IE7 è necessario specificare, per esempio, top: 0; a sinistra: 0 se si sta andando posizione d'uso: assoluta. Altrimenti di solito finisce a destra del sito. Un'altra cosa che doesnt ha senso quando si tratta di IE7.

Answer 1

Metti il ??tuo #NewsWrapper come un indice superiore a #NewsListing

Questo dovrebbe funzionare

Inoltre, non ho guardato il codice per ciclo ma sto supponendo che utilizza più alto z-index di 12. Probabilmente desidera utilizzare z-index> 1000 per qualcosa che si desidera essere il più avanti sulla schermo.

Ho appena avuto un momento davvero difficile con un problema simile. (CSS Drop Down andare sotto uno striscione) ho usato CSS per eventualmente risolvere il problema, cambiato il div genitore foratura tutta nav per position:absolute e un molto alto z-index ma ho testato questo e ha funzionato molto bene.