Parece ser que IE como siempre hace un poco lo que quiere con el HTML o las CSS. En esta ocasión hay un problema si tienes un elemento anterior con un z-index superior y el elemento posterior está con position: relative. IE pasará de tu z-index.

IE establece contextos z-index diferentes para cada elemento y por tanto el elemento posterior prevalece sobre los anteriores aunque tengan z-index superiores.

Después de buscar un poco encontré con klog y pude dar con ello. Os pongo el ejemplo que pone él:

  • Firefox: pantallazo de firefox comportándose con z-index

  • IE: pantallazo de IE comportándose con z-index Otra persona comenta otra solución:

    z-index: 0 !important; z-index: -1;

    No lo he probado pero quizás haya que volver a ella en algún momento…</li>

     

    Podéis probar esto online en varios navegadores (la explicación -en inglés- en su autor:

    A (relative) z-index: 1 2 3 4 none A’ (absolute) z-index: 1 2 3 4 none

    B (relative) z-index: 1 2 3 4 none B’ (absolute) z-index: 1 2 3 4 none

    </ul>