superponer dos fondos

[derkenuke]

La idea es tener un fondo base:


Y ponerle por encima un degradado PNG para hacerlo mas bonito:


Para mí queda espectacular:


Lo que hago es colocar dos divs de tamaños 100% en position:fixed, uno con z-index:-2 (puntos) y el otro con z-index:-1. El codigo es:

Código PHP:

  #fondo1 { 
    background-image: url("img/puntos.gif"); 
    position: fixed; 
    width:100%; height:100%; 
    top:0px; left:0px; 
    z-index:-2; 
} 
#fondo2 { 
    background-image: url("img/fondo_degradado.png"); 
    position: fixed; 
    top:0px; left:0px; 
    width:100%; height:100%; 
    z-index:-1; 
}  
   

Código PHP:

  <div id="fondo1">&nbsp;</div> 
<div id="fondo2">&nbsp;</div>  
   

Ahora viene el problema: sólo me funciona bajo Opera.
En firefox los z-index no me hacen ni caso. Los negativos hacen desaparecer las capas, los positivos tapan toda mi pagina (aunque la pagina tenga z-index:100).
Del IE ni hablamos... por cierto hay alguna esperanza de que funcione?

¿Como hago que funcione en mozilla?