sfondo header e pagina completa

**davidinho** · 29-02-2012, 15:07

vorrei mettere uno sfondo che si ripete in orizzontale e in verticale che ricopre tutta la pagina ed un altro sfondo che si ripete solo in orizzontale che funge da header ma non trovo come fare...

probabilmente è una cosa stupida da fare, ma è passato un bel po' di tempo dall'ultima volta che ho lavorato con i CSS quindi sono un po' arrugginito

P.S.: ho anche provato mettendo lo sfondo principale al body e poi inserire un div all'interno con width 100% contenente lo sfondo header, sembra andare, poi però ridimensionando la finestra mi accorgo che il div interno rimane della dimensione della finestra, quindi scorrendo con la barra di scorrimento appare la parte non coperta dallo sfondo header...

**ac_socmel** · 29-02-2012, 16:01

width è calcolata in relazione al contenitore "genitore"
in questo caso body

**davidinho** · 29-02-2012, 16:07

si infatti anche il body sembra diventare della dimensione della finestra eppure lo sfondo prosegue...

**ac_socmel** · 29-02-2012, 16:09

ok lo dico meglio
cancella width e il suo valore

**davidinho** · 29-02-2012, 16:28

mi sa che mi sono spiegato male

ho fatto varie prove con questo breve pezzo di codice

codice:

<html>
	<head>
	</head>
	<body style="background-color: red;">
		<div style="height: 200px; background-color: green;"></div> 
		<div style="width:800px; height:100px; border:solid 3px black">CONTENUTO...</div>
	</body>
</html>

in pratica al body do uno sfondo, dopodiché vorrei inserire un altro sfondo che dovrebbe fungere da header e si dovrebbe ripetere orizzontalmente, inserisco perciò un nuovo div che si limiterà a contenere uno sfondo(poi se servirà inserirò all'interno anche del testo o altro)

sembra funzionare tutto correttamente, inserisco allora sotto l'header un div con dimensione fissa contenente tutto il resto del sito, qui nascono i problemi, se ridimensiono la finestra del browser sotto gli 800px e poi scorro con la barra di scorrimento l'header non prosegue il suo sfondo...

spero di aver spiegato ora il problema, comunque copiando e incollando al volo il pezzo di codice scritto puoi osservare direttamente quello che intendo...

non so più dove sbattere la testa

**davidinho** · 29-02-2012, 17:51

risolto aggiungendo min-width: 800px al body

**ac_socmel** · 29-02-2012, 18:05

ottimo
stavo aspetando a dirtelo, per vedere dove andavi a parare

**davidinho** · 29-02-2012, 18:13

una parte di me dice che dovrei crederti, l'altra no... quale sentire?

**ac_socmel** · 29-02-2012, 18:23

prova a guardare il mio sito e vedrai applicate tante tecniche diverse
alcune più vecchie alcune più recenti
altre addirittura sperimentali

Discussione: sfondo header e pagina completa

Strumenti discussione

Ricerca discussione

Visualizza

sfondo header e pagina completa

Permessi di invio