Avere header variabile in rapporto all'ampiezza della pagina

[Michi81]

Ciao a tutti!

Nel mio sito ho messo in alto una sorta di header, che consiste in una barra blu, dove ho scritto in bianco il titolo del sito. Purtroppo questo header ha delle dimensione fisse, per cui se vado a restringere troppo il browser, viene tagliato. Se invece amplio troppo il browser, appare lo spazio bianco a lato.
Ad es. invece l'header con l'uomo vitruviano e il codice binario di SWZone si adatta alla pagina, ingrandendo o rimpicciolendo la finestra del browser.
Questo è il codice che ho usato:

<div id="shape1" style="position:absolute; overflow:hidden; left:0px; top:0px; width:927px; height:150px; z-index:4; background-color:#00CCFF"></div>

Come posso far sì che si adatti alla finestra del browser?

Grazie!



P.S.: nell'allegato potete vedere come si comporta l'header (barra blu chiaro) quando la finestra del browser è troppo grande. Si vede infatti sulla destra lo sfondo (bianco con fiori/stelle blu).

[webdemo]

Originariamente inviato da Michi81
<div id="shape1" style="position:absolute; overflow:hidden; left:0px; top:0px; width:927px; height:150px; z-index:4; background-color:#00CCFF"></div>

Come posso far sì che si adatti alla finestra del browser?

se ho capito cosa vuoi fare dovresti risolvere così:

<div id="shape1" style="position:absolute; overflow:hidden; left:0px; top:0px; width:100%; height:150px; z-index:4; background-color:#00CCFF"></div>

ciaux

[Michi81]

Grazie mille, davvero gentilissimo: appena torno dall'ufficio, provo come mi hai detto!

Grazie ancora!!!

[Michi81]

Funziona, grazie ancora!