¿Por qué z-index no funciona?

Para asegurarte que z-index funciona en una página web tienes que verificar lo siguiente:

• Que el elemento donde tienes aplicado el z-index tiene el atributo position, que sea igual a "absolute", "fixed", "relative".

.mis_elementos {
    position: relative;
}

Si no tienes definido un position válido, el atributo z-index no tendrá valor alguno.

• Que el elemento donde tienes aplicado el z-index no tiene un z-index menor que el elemento sobre el que te quieres superponer.

Esto es importante y puede dar lugar a errores difíciles de detectar. Por ejemplo, en el siguiente código.

<div class="mi_padre">
    <span class="mi_hijo">
        ... contenido ...
    </span>
</div>

<style>
    .mi_padre {
        position: relative;
        z-index: 10;
    }
    .mi_hijo {
        position: absolute;
        z-index: 1000;
    }
</style>

Por mucho que al elemento de clase "mi_hijo", le hayas marcado un z-index de 1000, si lo has colocado dentro de otro elemento que tiene el z-index de 10, no conseguirá ganar el valor de z-index 1000.

Revisa estas dos situaciones y seguramente consigas resolver tu problema de posicionamiento.