Sfondo fisso div che si sovrappone alle barre di scorrimento del browser

Question

Comportamento molto strano che non ho mai visto prima.

Ho un div di posizione fisso che ha un'immagine di sfondo png trasparente. Lo z-index è impostato su -1 in modo che il contenuto possa scorrere sull'immagine fissa con le barre di scorrimento.

l'ho posizionata con il fondo e giusto al 0px, ma l'immagine si sovrappone le barre di scorrimento

Ecco il link (su FF e Safari, in ogni caso.):

http://adamjcas.www59.a2hosting.com/pg/show/id/4

CSS:

#plants /*for the cut paper plants in the background*/ 
{ 
    background: transparent url(../background_images/plants.png) no-repeat;           
    bottom:0px; 
    right:0px; 
    z-index: -1; 
    position:fixed; 
    height:691px; 
    width:475px;   
} 

una trucco che ho usato era quello di utilizzare destra: 16px;

Che ha funzionato bene, in quanto vi è sempre (probabilmente) una barra di scorrimento destra. Ma il rotolo in basso è solo qualche volta lì. Si tratta di un semplice problema CSS?

Answer 1

Era uno strano problema. Ma ho capito che la barra di scorrimento non era dal browser, ma dal div genitore che aveva overflow: auto.

Ecco come l'ho risolto. Modificare lo stile per div id="rightpanel" per rimuovere overflow: auto;.

Poi aggiornare gli stili #rightcontent come segue:

#rightcontent { 
    left: 445px; 
    padding-top: 127px; 
    position: relative; 
    width: 650px; 
} 

Speriamo che dovrebbe risolvere il problema per tutti i browser. Oltre a ciò ho anche trovato che i browser si lamentavano di non aver trovato Cufon.js. Potresti volerlo esaminare anche tu.