Pagine a schermo intero

[mrsponkie]

Salve a tutti ,

Io ho sempre creato dei siti web con il background che solitamente era un'immagine jpg (2-3 px di larghezza) con 2 colori sfumati che ripetevo all'infinito sull'asse delle X . Poi creavo il container a dimensioni fisse e all'interno ci inserivo i vari "header" , "barra navigazione" , "contenuto" , "footer" .

Ho notato però dal sito : http://cssremix.com/ che adesso tutti i siti vengo creati a schermo intero . La mia domanda è :

Ma come fanno a creare sfondi così belli senza ricorrere a immagini pesantissime? Man mano che "scrollo" verso il basso noto poi diversi colori di background (es : http://cssremix.com/visit/solid-giant/ ) come fanno a inserire diversi colori di bg a tutto schermo??

Io mi sono risposto che forse fanno diversi "div container" , uno sopra l'altro , impostati con width auto , e da lì ci inseriscono i background , ma forse c'è un metodo + semplice .

Saluti .

mr sponkie

[furbostandby]

Originariamente inviato da mrsponkie
Io mi sono risposto che forse fanno diversi "div container" , uno sopra l'altro , impostati con width auto , e da lì ci inseriscono i background , ma forse c'è un metodo + semplice .

Effettivamente è proprio così che si fa per ottenere sfondi diversi nella stessa pagina, e per quanto ne so non esiste un modo più semplice di questo.
Hai ragione anche dicendo che utilizzare un'unica immagine è impensabile, per motivi di pesantezza del sito stesso.

Non so cosa tu intenda per

uno sopra l'altro

ma i div sono disposti così:

<div>
</div>
<div>
</div>
<div>
</div>
... 

Ciao

[mrsponkie]

Innanzitutto ti ringrazio di avermi risposto

Effettivamente "uno sopra l'altro" era un pò spiegato male .

Intendevo dire che il sito è strutturato così se non ho capito male :

<div id="container1"></div>
<div id="container2"></div>
<div id="container3"></div>

Poi ovviamente ciascun container avrà arroccati al suo interno i vari div che compongono ogni "porzione" di pagina.
Molto interessante , grazie , il prossimo sito proverò a svilupparlo in questa maniera .

[mrsponkie]

Altra domandina .

Ho iniziato a fare alcune prove . Nei css ho azzerato tutti i margini al BODY . E infatti "container1" lo vedo a schermo intero , quello che non capisco è perchè "conteiner2" me lo ritrovo si sotto , però non attaccato come pensavo che venisse , ma a circa 20 px di distanza da "container1" .
Sul body avevo messo 0 a margin bottom , eppure a quanto pare non funziona . Riesco solo ad attaccare i 2 container settando "-20px" al margin TOP di "container 2" , ma mi sembra + una soluzione accomodata . Non riesco a capire dov'è che sbaglio , qualcuno può aiutarmi?

[furbostandby]

Imposta a tutti i container margin e padding a 0: l'interpretazione dei browser non è sempre così rigorosa, perciò vanno sempre specificati anche se teoricamente sarebbero impliciti.

Non c'entra se questi parametri ci sono già sul body: queste proprietà non sono ereditate.

Può essere opportuno anche settare a 0 l'attributo HTML border.