Posición fija en background para Chrome y Safari

[wolfmoon]

Buenas, tengo un problema con chrome y safari, el caso es que tengo una capa con un fondo con posicion fija, en mozilla se ve correctamente, en chrome no se muestra ni la imagen y en safari se muestra pero no queda fija.... he buscado en google pero no encuentro solucion.....

El codigo lo tengo asi:

Código CSS:

#principes .spanImg {position:absolute: width:100%; height:100%; top:0; left:0; background:url('imagen') top center no-repeat fixed; opacity:0.18; }
 

[pzin]

¿No tiene extensión el archivo?

[wolfmoon]

Si si, lo puse asi yo al escribirlo aqui, pero si tiene si....

[pzin]

Pues en principio está correcto.

Lo único que se me ocurre es que sea un elemento en linea al que le estás aplicando eso. Prueba a ponerle:

Código CSS:

display: block
 

Si no es eso, entonces igual tendrás que aportar algo más de código, HTML/CSS, para ver cual pueda ser el problema.

[wolfmoon]

Ok, es que es raro porque estoy viendo el mismo codigo en otra web(mas o menos) y funciona correctamente en todos los navegadores.

Tengo una seccion y dentro dos capas:

Código CSS:

section { position:relative; width:100%; background-color:#fff; z-index:10; }
    .sectionWrapper { position:relative; width:100%; height:100%; overflow:hidden; }
    .spanImg { position:absolute; top:0; left:0; width:100%; height:100%; }
 
    #principes {  width:100%; display:block; background:#f6f6f1; }
    .full-principes { height:560px; }
    #info-principes { padding-top:60px; }
    #principes .spanImg { background:url('../img/shadow_back_3.jpg') no-repeat fixed top center transparent; opacity:0.18; display:block }
 

El HTML:

Código HTML:

<section id="principes" class="full-principes">
                 <div class="sectionWrapper">
                   <div class="spanImg"></div>
         </div>
           </section>