layout fluido con immagine in header

**Miwako** · 15-03-2008, 13:46

Ciao a tutti, avrei un quesito; (premetto che ho iniziato da poco a capire il css)
Vorrei creare un sito fluido che si adatti alla larghezza dello schermo dell'utente; ho creato in div tabella che contiene header, menu e contenuti.
al div tabella ho dato margine destro e sinistro 5% e inserito nella header l'immagine di larghezza 900px.
tutto ok per la mia risoluzione (1024x768) e per quelle superiori, ma quando vado a ridimensionare "manualmente" la finestra del browser la mia header rimane ok ma i contenuti, se prima erano a 5% a destra e sinistra, risultano a 5% a sinistra, ma a destra cambia, e di parecchio.
Ho provato anche a dare una larghezza in percentuale, togliendo i margini ma poi non risulta in centro.
Cosa mi consigliate?
Grazie a tutti in anticipo.

**fcaldera** · 15-03-2008, 15:05

centra il div tabella

<body>
<div id="tabella">

</div>
</body>

body {
text-align: center;
width: 100%;
}

#tabella {
text-align: left;
margin: 0 auto;
width: 90%
}

**Miwako** · 16-03-2008, 10:35

grazie; ho provato e funziona solo con explorer.
Alla fine ho optato per una soluzione fissa e non fluida, dite che è uno sbaglio?

**Miwako** · 18-03-2008, 19:35

ok, grazie.
navigando in internet, avevo trovato uno script (credo) che, creati due fogli di stile uno per IE e l'altro per Firefox, a seconda del browser usato, caricava il foglio adatto; purtroppo non ricordo il codice, qualcuno me lo sa dire?

**Mich_** · 19-03-2008, 09:32

Si puo` fare anche con uno script, ma e` meglio usare i "commenti condizionali", che inseriscono del codice che viene interpretato solo da IE.
Trovi info nei "link utili", oppure con una ricerca nel forum.

In pratica devi:
1. inserire il CSS (o il <link>) per i browser standard
2. inserire i commenti condizionali, che contengono il CSS (o link) per le correzioni da apportare al CSS principale per renderlo compatibile IE.

Discussione: layout fluido con immagine in header

Strumenti discussione

Ricerca discussione

Visualizza

layout fluido con immagine in header

Permessi di invio