Domanda

Ho un paio di Div che modellano usando una classe e un ID, i div stessi sono vuoti perché sono solo segnaposto per il loro background. Esempio Div:

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

Quindi li modifico usando questo 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;
}

Fintanto che il Div è nell'angolo in alto a sinistra del documento, l'immagine viene mostrata correttamente ma quando il Div è posizionato altrove sulla pagina l'immagine rimane (invisibile) nell'angolo in alto a sinistra della pagina mostrando solo la parte che si sovrappone al div (nell'esempio questa sarebbe la parte inferiore dell'immagine).

Modifica Sto cercando di posizionare questi Div senza influenzare il mio altro layout, sono dietro l'altro layout. Questo funziona tranne per il fatto che l'immagine di sfondo non segue la posizione div.
Quindi, fondamentalmente, la mia domanda è: perché lo sfondo per il posizionamento div ranImg1 non è con il div ma rimane nell'angolo in alto a sinistra e come risolvere questo problema?

È stato utile?

Soluzione

il tuo allegato-sfondo: fisso allega l'immagine di sfondo relativa alla finestra del browser. se vuoi che " segui " la posizione div , basta rimuovere la riga:

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

puoi anche impostare l'attributo background-position per impostare lo sfondo rispetto al div contenente:

background-position: 0px 0px;

non sono sicuro se ciò aiuterebbe oltre la semplice rimozione di sfondo allegato (non ancora abbastanza caffè!)

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top