Tema: no me funciona z-index
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 16/06/2016, 12:37
lobopk2
 
Fecha de Ingreso: diciembre-2015
Mensajes: 62
Antigüedad: 8 años, 4 meses
Puntos: 0
no me funciona z-index
Pues eso, no comprendo porque no funciona el z-index

tengo este codigo html

Código HTML: 
Ver original
  1. <body>
  2.  
  3.  
  4. <svg  viewBox="0 0 1000 800">
  5.  
  6.  
  7.     <rect class="rojo" style="fill-rule:evenodd;stroke:#f00;stroke-width:.5;fill:#f00" height="70.53" width="355.5" y="58.71" x="28.79"/>
  8.     
  9.     
  10.     
  11.     <rect class="azul" style="fill-rule:evenodd;stroke:#f00;stroke-width:.5;fill:#00f" height="70.53" width="355.5" y="58.71" x="562.8"/>
  12.  
  13.     
  14.     <rect class="verde" style="fill-rule:evenodd;stroke:#f00;stroke-width:.5;fill:#0f0" height="70.53" width="355.5" y="58.71" x="316.7"/>
  15.     
  16.  
  17. </svg>
  18.  
  19.  
  20. </body>

y esta hoja de estilos

Código CSS: 
Ver original
  1. .verde {z-index:-1;}
  2. .rojo {z-index:2;}
  3. .azul {z-index:3;}

ahora se ve el verde encima de todos, cuando lo queria debajo de todos, segun la intruccion css, deveria dejarlo debajo de los otros, pero no funciona, esto porque es?