layout monolitico elastico ie6

[DarioMarco]

salve a tutti, ho creato un layout monolitico elastico a tre sezioni:
head contenuto footer, ma come al solito si sono verificati alcuni problemi:
il font non varia al variare della risouzione usata;
il font nella sezione head sembra diverso da quello della sezione contenuto (ma si potrebber rimediare);
lo sfondo della sezione head non si allunga coprendo tutta l'estensione del browser.

il codice css è il seguente:

/* CSS Document */
html,body {
margin:0;
padding:0;
}
body {
font-family: "Trebuchet MS", "Courier New", Courier, mono, ;
color: #000066;
font-weight:bold;
font-size:76%
}
div#container {
width:60em;
margin-top: 0;
margin-right: auto;
background-image: url(../immaggini/altro/spiaggia.jpg)
}
div#testa {
background-image: url(../immaggini/altro/spiaggiaSu.jpg);
}


non badate ad immaggini con due "g".

la cosa più strana è che in dreamweaver vedo tutto come si deve, ma quando lo pubblico in ie6 mi riporta gli errori su mensionati.

dove sbaglio???
Grazie, ciao.

[floyd46]

ciao
hai la pagina in rete? così possiamo vedere cosa è che nn va.
Floyd

[thomas_anderson]

Per coprire tutta l'estensione della finestra lo sfondo deve essere pari o maggiore della finestra del browser. Ovvio che se lo imposti come background di una sezione di cui non hai specificato l'altezza potranno esserci dei problemi. Altra cosa: hai impostato dei font che appartengono a due famiglie diverse: il Trebuchet appartiene ai sans-serif, ed il Courier ai monospace. ti consiglio di impostare i font al 100% per body, e poi di fare il ridimensionamento al 76% per il contenuto.

[DarioMarco]

Grazie per le Vostre risposte, non ci speravo più.

Non ho la pagina in rete, visto il risultato non l'ho pubblicata proprio, ma se fosse necessario, sono pronto a pubblicarla.

Per quanto riguarda lo sfondo head, le dimensioni del quadro (photoshop7.0) e di larghezza 1280px (massima risoluzione possibile o per lo meno molto alta) e di altezza 110px (il contenitore è alto 105px, i 5px sono per sicurezza).

Per il font, farò come mi hai detto te, grazie mille per avermi fatto notare il mio errore .

anzi, già che ci sei potresti postarmi il mio stesso codice nel modo corretto???

Grazie, ciao.

[thomas_anderson]

Il tuo codice era:

html,body { 
margin:0; 
padding:0; 
} 
body { 
font-family: "Trebuchet MS", "Courier New", Courier, mono, ; 
color: #000066; 
font-weight:bold; 
font-size:76% 
} 
div#container { 
width:60em; 
margin-top: 0; 
margin-right: auto; 
background-image: url(../immaggini/altro/spiaggia.jpg) 
} 
div#testa { 
background-image: url(../immaggini/altro/spiaggiaSu.jpg); 
}

cambio solo le parti interessate:

body {
font: bold 100% "Trebuchet MS", Trebuchet, sans-serif;
color: #000066;
background: /* specifica un colore */
}
div#container {
font-size: 76%;
width: 60em;
margin-top: 0;
margin-right: auto;
/* e gli altri margini che fanno? */
background-image: url(tuaimg.gif);
/* repeat, no-repeat, position.... scegli! */
}
div#testa {
width: 60em;
height: /* specifica un altezza */
background: url(banner.gif) no-repeat top left;
}

ciao

[DarioMarco]

thnx, a dire il vero immaginavo di aver combinato qualche pasticcio, sembrava troppo facile, vorrei però farti qualche domanda sul codice:

background: /* specifica un colore */ < se non lo specifico, ha importanza???

margin-top: 0;
margin-right: auto;
/* e gli altri margini che fanno? */
< allora dovrei mettere margin: 0 auto 0 0; va bene???

background-image: url(tuaimg.gif);
/* repeat, no-repeat, position.... scegli! */ < se non metto nulla mi ripete l'immagine partendo da 0 0 ripetendola sia in verticale che in orizzontale, e a me va bene, ma dovrei scrivere ugualmente no-repeat?


div#testa {
width: 60em;
height: /* specifica un altezza */ < dovrei mettere 105px ???
background: url(banner.gif) no-repeat top left;
}


Grazie per la tua pazienza, ciao.

[thomas_anderson]

Il colore ha importanza perchè altrimenti il validator ti da un warning. I margini andrebbero sempre specificati, anche se il loro valore di default è 0. se non metti nulla ti da un'immagine ripetuta. puoi anche specificare un'altezza relativa, come 10%. ciao

[DarioMarco]

perdonami thomas, ma ho provato come mi hai detto te, ma non funziona, cmq devo precisare una cosa: nella sezione head ho una tabella a due colonne, dove la seconda è divisa in due righe, e come dimensione della tabella ho messo 100% e altezza 105px, questo potrebbe influire???

Come ti ripeto: sul programma che uso per costruire il sito, (dreamweaver-mx), nella fase di progettazione mi esce tutto impaginato perfetto, ma quando vado a testarlo sul browser ie6 non mi funziona. Magari potrebbe essere qualche problema relativo all'installazione del browser???

Grazie, ciao.

[DarioMarco]

ciao thomas, non penso che sia un errore del software, ma visto che ie ha sempre avuto problemi coi css penso sia difficile risolvere, cmq, spedisco il link del mio sito, il codice è quello postato in precedenza,

http://www.calabriainvacanza.com/flash/MainCartina2.asp

grazie per il vostro aiuto.