L'arrière-plan Div ne se positionne pas avec le Div

Question

J'ai quelques Divs que je style en utilisant une classe et un ID, les div eux-mêmes sont emtpy car ils ne sont que des espaces réservés pour leur arrière-plan. Exemple Div:

<div id='ranImg1' class='ranImg'></div> 

Je leur style en utilisant ce css:

.ranImg { 
    position:fixed; 
    z-index:0; 
    width:250px; 
    height:250px; 
    display:block; 
} 
#ranImg1 { 
    left:10px; 
    top:200px; 
    background-attachment:fixed; 
    background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png); 
    background-repeat:no-repeat; 
} 

Tant que la division est dans la partie supérieure gauche du document l'image montre correctement, mais lorsque la division est placé ailleurs sur la page, l'image reste (invisible) dans le coin supérieur gauche de la page ne montrant que la partie qui chevauche la div (dans l'exemple, ce serait la partie inférieure de l'image). J'essaie de positionner ces Divs sans affecter mon autre mise en page, ils sont derrière l'autre mise en page. Cela fonctionne sauf pour le fait que l'image d'arrière-plan ne suit pas la position divs.
Donc, fondamentalement ma question est, pourquoi est-ce que l'arrière-plan pour le positionnement div divanimg1 avec le div mais reste dans le coin supérieur gauche, et comment résoudre ce problème?

Answer 1

votre background-attachment:fixed joindra l'image d'arrière-plan relative à la fenêtre du navigateur. si vous voulez qu'il « suivre » la position div, il suffit de retirer la ligne:

#ranImg1{ 
    left:10px; 
    top:200px; 
    background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png); 
    background-repeat:no-repeat; 
} 

vous pouvez également définir l'attribut background-position pour définir l'arrière-plan par rapport au contenant div:

background-position: 0px 0px; 

i » Je ne sais pas si cela pourrait aider au-delà de simplement supprimer background-attachment (pas assez de café pour le moment!)