Inserire 2 background

[Roxas93]

Mi trovo in una situazione più unica che rara.
Questo è il mio sito. Come potete vedere, tutto il template principale non è altro che il background. Per ovvie ragioni, quindi, la pagina non può essere troppo lunga. Questo è un problema.
Se mettessi il background in "repeat", questo si ripeterebbe in basso ma, insieme al background, si ripeterebbe anche la striscia nera in cui c'è il menu e tutto il resto. Quindi volevo risolvere così:

Usare questo BG, in modalità repeat. Così facendo avrei il portale lungo quanto voglio... però vedrei le immagini e i menu come se fossero messi lì tanto per... quindi mi chiedevo se e come potevo inserire 2 background. Il primo in modalità repeat (quello sopracitato) mentre il secondo che compare slo una volta in alto. Quest'ultimo non sarà altro che la fascia in cui si poggia il menu (questo)

[adottauncane]

Ciao Roxas93,
io proverei ad inserire la testata, ritagliata dallo sfondo che hai adesso, qui:
style.css (riga 102)

Codice: [Seleziona]

#wrapper {
-moz-background-clip:border;
-moz-background-origin:padding;
-moz-background-size:auto auto;
background-attachment:scroll;
background-color:transparent;
background-image:url("../images/bgbody.jpg"); <---- immagine testata come adesso solo corta quanto basta
background-position:center top; <----- posizione
background-repeat:no-repeat;
margin-bottom:0;
margin-left:auto;
margin-right:auto;
margin-top:0;
padding-bottom:0;
padding-left:0;
padding-right:0;
padding-top:0;
text-align:left;
width:960px;
}e nel body il nuovo sfondo senza testata ripetuto...

[adottauncane]

Anzi, puoi metterla nell'header così:
style.css (riga 109)

Codice: [Seleziona]

#header {
background-image:url("../images/bgbody.jpg");
background-position:center top;
height:388px;
margin-bottom:0;
margin-left:0;
margin-right:0;
margin-top:0;
padding-bottom:0;
padding-left:0;
padding-right:0;
padding-top:0;
}
forse è meglio...

[adottauncane]

Scusa ho capito solo adesso cosa ti serve... 
Adesso ci penso...

[adottauncane]

Ok, prova comunque nel wrapper, così:
style.css (riga 102)

Codice: [Seleziona]

#wrapper {
background-image:url("http://img651.imageshack.us/img651/3220/aaaahk.png"); <--- qui la tua nuova immagine, io ho messo il link che hai postato
background-position:center 310px; <---- posizione
background-repeat:no-repeat;
margin-bottom:0;
margin-left:auto;
margin-right:auto;
margin-top:0;
padding-bottom:0;
padding-left:0;
padding-right:0;
padding-top:0;
text-align:left;
width:960px;
}
per lo sfondo metti nel body la nuova immagine e nell'header la fascia con il marchio, oppure l'attacchi al wrapper e, in quel caso, la position diventa: center top.
Spero di non averti confuso troppo...

[conti1]

ciao
scusate se mi intrometto

Così facendo avrei il portale lungo quanto voglio.

non e proprio cosi la prima immagine ha un' altezza 1917 x cui sei ancora dentro con quella altezza anche se fai la seconda immagine.
l'immagine che ora fa anche da blu trasparente al contenitore    ecco xche dico sei ancora con un template con altezza fissa.
bisogna modificare anche il contenitore   altrimenti  non si risolve anche se metti la seconda immagine.
scusa adottauncane  se mi sono permesso di intrufolarmi nel discorso.

[adottauncane]

Figurati conti1, sempre il benvenuto, lo sai... soprattutto se faccio confusione. 
Grazie mille.

[Roxas93]

Innanzitutto grazie ad entrambi. Rispondo prima a cont.
Non ho ben capito cosa intendi ma se per ora l'immagine da 1917pixel basta è perché ho inserito un limite di 3 news per pagina e ho messo pochissimi moduli...  cosa intendi per "modificare il contenitore"?

@adottauncane: Ho capito quasi tutto, ma quale sarebbe il logo+fascetta?
Se ti riferisci al logo fatto in stile tribale, quello lo inserirò servendomi di un modulo html in posizione topright, che ovviamente accentrerò (non so se vi ricordate ma siete stati proprio voi due a dirmi come fare )... Per la fascetta... non la inserisco già nel wrapper come mi hai detto di fare tu? Il background che si ripeterà andrà nel body... e fin qui, tutto ok; l'immagine semitrasparente nera (ovvero il "menu" ) la inserisco nel wrapper... cosa manca più?

[adottauncane]

Niente.  Parlavo del marchio tribale ("fascia", ho visto che la "fascetta" del menù l'hai già inserita). Puoi metterlo anche nell'header, come ti ho scritto, oppure come hai scritto tu... Son contenta di non averti confuso, non troppo almeno...

[Roxas93]

Niente.  Parlavo del marchio tribale ("fascia", ho visto che la "fascetta" del menù l'hai già inserita). Puoi metterlo anche nell'header, come ti ho scritto, oppure come hai scritto tu... Son contenta di non averti confuso, non troppo almeno...

Grandissima! È andato tutto come volevo che andasse... tutto risolto in 5 minuti, non potevo sperare di meglio.
Grazie!
Ho solo un ultimo problema, che però non è legato a quest'altro dei due background... si tratta del logo: su firefox è centrato e su Internet explorer no... cosa faccio, metto "risolto" a questo topic e ne faccio un altro o potete darmi un rapido aiuto qui?

[adottauncane]

Ehhh, questa è cosa per conti1!
Oppure prova ad inserirlo direttamente nell'header, avendo cura di mettere i margini left e right a 0, come nel codice postato...

[Roxas93]

Temo di non aver capito cosa/come intendi fare...

[adottauncane]

Prova a toglierla da dove l'hai messa e inseriscila così:
style.css (riga 117)

Codice: [Seleziona]

#header {
background-image:url("/images/logoportale.png");
background-position:center center;
background-repeat:no-repeat;
height:388px;
margin-bottom:0;
margin-left:0;
margin-right:0;
margin-top:0;
padding-bottom:0;
padding-left:0;
padding-right:0;
padding-top:0;
}
magari IE non ha problemi...