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...

    •  

    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