[RISOLTO] Immagine "extra" wrapper

[pierca]

Vorrei sapere se è possibile aggiungere un'immagine che vada oltre la larghezza del wrapper: una specie di immagine di sfondo che però rimanga vicino al logo...
http://provafutura.altervista.org/

[adottauncane]

Ciao pierca,
si puoi, sostituendo questa:
images/page_bg.png
template.css (riga 92)

Codice: [Seleziona]

#page_bg {

background-image:url("../images/page_bg.png");
background-position:left top;
background-repeat:repeat-x;
background-attachment: fixed;
}

e poi nettendo la position e il repeat come ti servono e un background-attachment: fixed; se la vuoi fissa. In questo caso però toglierebbe la fascia verde che hai adesso e si vedrebbe anche sotto al wrapper.

Quindi poi dovresti mettere un background qui:
template.css (riga 96)

Codice: [Seleziona]

#wrapper {
margin-bottom:0;
margin-left:auto;
margin-right:auto;
margin-top:0;
position:relative;
width:960px;
background: #FFFFFF <-----
back
}


[pierca]

Per adesso grazie. Prima leggo bene; capisco; ci provo e poi ti dico...

[pierca]

Ho cercato di capire e spero di esserci riuscito per quasi tutto. Però ho - almeno - un dubbio (per ora...): dove metto l'immagine da inserire, considerato che "page_bg.png" ha solo una colonna verde che poi ripete in orizzontale?

[pierca]

...

[adottauncane]

Sostituisci la tua immagine a page_bg.png. Lascia lo stesso nome per facilità e, a seconda che sia un'immagine che si ripete o no, metti repeat o no-repeat dove adesso hai repeat-x.
Naturalmente la fascia verde sparirà quindi, se la vuoi, la devi includere nella tua nuova immagine. La nuova immagine avrà un'altra dimensione, ma non importa...

[pierca]

Funziona benissimo grazie, ma l'immagine adesso non viene visualizzata negli schermi più piccoli, nei quali rimane fuori. Cosa ho sbagliato e che devo fare?
http://provafutura.altervista.org/

[adottauncane]

Be, potresti fare così:

Codice: [Seleziona]

#page_bg {
-moz-background-clip:border;
-moz-background-origin:padding;
-moz-background-size:auto auto;
background-attachment:scroll;
background-color:transparent;
background-image:url("../images/page_bg.png");
background-position:center top; <------
background-repeat:no-repeat; <-----
}template.css (riga 92)

e allungare il verde dai due lati, fino a 2000px, per gli schermi più grandi.

[pierca]

Grazie mille per ora. Domani provo, poi ti dico...

[pierca]

Grande! Funziona benissimo grazie mmmmmoltissimo