si vede male con firefox

[Always]

ciao a tutti.
scusate ma nn sono molto esperta forse ho fatto qualche errore..
ho fatto questo semplice sito.lasciate perdere i contenuti perchè ancora non c'è niente
è qui:
http://cris83.altervista.org/index.html
potete dirmi perchè con firefox non si vede centrato e si vede male il footer?
vi metto il file css sotto..
---css---
body
{
text-align: center;
font-family: Verdana;
font-size: 11px;
background: #ffeafa;
}

#centrato{
width: 800px;
}

#testata{
background-image: url(images/testatagir.jpg);
width: 800px;
height: 223px;
text-align: left;
}

#testata2{
background-image: url(images/testatagir2.jpg);
width: 800px;
height: 223px;
text-align: left;
}

/*#testata3{
background-image: url(images/testatagir.jpg);
width: 800px;
height: 223px;
text-align: left;
}

#testata4{
background-image: url(images/testatagir2.jpg);
width: 800px;
height: 223px;
text-align: left;
}

#testata5{
background-image: url(images/testatagir.jpg);
width: 800px;
height: 223px;
text-align: left;
}
*/
#corpo
{
background-image: url(images/sfondo.jpg);
margin: 0 auto;
padding: 0 auto;
width: 800px;
height: 600px;
}

#colonnasx{
margin: 0 auto;
float: left;
width: 178px;}

div.MENU
{
width: 98px;
margin: 60px; /*per abbassare menu*/
}

a.MENU
{
display: Block;
position: relative;
background: #6d7fdf;
/*background: #ffc3f2;*/
color: #000000;
font: Normal 11px Verdana;
text-decoration: None;
padding: 1px 3px 3px 0px;
margin: 10px 0px 1px 0px;
border-style: double;
height: 10px;
}
a.MENU:hover
{
border-style: ridge;
}

#colonnadx
{
text-align: left;
margin: 0 auto;
width: 579px;
}

#footer{
background-image: url(images/footer.jpg);
width: 800px;
height: 49px;
text-align: center;
}

div.TESTO{
padding: 15px;
text-align: left;
}

h3.TESTO{
color: #0000ff;
}
a.TESTO{
text-decoration: None;
color: #ff00ff;
}

[oronze]

metti tutto il tuo sito in un div con id container e integra con questo css

body{
margin: 0px;
height: 100%;
width: 100%;

}
#container{
width: LARGHEZZA_SITOpx;
position: absolute;
left: 50%;
margin-left: -(LARGHEZZA_SITO/2)px;
}

[Always]

risposta velocissima..gentilissimo!!
provo subito..
grazie mille!!

[Always]

ciao!
purtroppo sono ancora io..
sono riuscita a centrarlo ma il footer si vede male e anche la scritta viene tutta spostata forse perchè ho sbagliato a mettere tutto uno sfondo unico a tutto il corpo, dovevo mettere uno sfondo a colonna destra e colonna sinistra.
il sito è sempre qui http://cris83.altervista.org/home.html
vi rimetto il css cmq.


body
{
margin: 0px;
height: 100%;
width: 100%;
text-align: center;
font-family: Verdana;
font-size: 11px;
background: #ffeafa;
}

#container{
width: 800px;
position: absolute;
left: 50%;
margin-left: -400px;
}

#centrato{
width: 800px;
}

#testata{
background-image: url(images/testatagir.jpg);
width: 800px;
height: 223px;
text-align: left;
}

#testata2{
background-image: url(images/testatagir2.jpg);
width: 800px;
height: 223px;
text-align: left;
}

#corpo
{
background-image: url(images/sfondo.jpg);
margin: 0 auto;
padding: 0 auto;
width: 800px;
height: 600px;}

#colonnasx{
margin: 0 auto;
float: left;
width: 178px;}

div.MENU{
width: 98px;
margin: 60px; /*per abbassare menu*/}

a.MENU
{
display: Block;
position: relative;
background: #6d7fdf;
/*background: #ffc3f2;*/
color: #000000;
font: Normal 11px Verdana;
text-decoration: None;
padding: 1px 3px 3px 0px;
margin: 10px 0px 1px 0px;
border-style: double;
height: 10px;
}
a.MENU:hover
{
border-style: ridge;
}

#colonnadx
{
text-align: left;
margin: 0 auto;
width: 579px;
}

#footer{
background-image: url(images/footer.jpg);
width: 800px;
height: 49px;
text-align: center;
}

div.TESTO{
padding: 15px;
text-align: left;
}

h3.TESTO{
color: #0000ff;
}
a.TESTO{
text-decoration: None;
color: #ff00ff;
}

p.MAIL{
margin-top:18px;}
div.TESTO{
padding: 15px;
}

[oronze]

devi giocare con i margin - pagging e posizionamenti...scusami ma non ho tempo per smanettarci io sù...mi spiace

[sloth.86]

Semplicemente dai al div principale contente tutto il sito:

margin-left: auto;
margin-right: auto;

Per risolvere il problema del footer dovresti rempostare i margini superiori del p che si trova nel footer a 0!
Il problema è che firefox ha un bacco nell'interpretazione dei margini e quindi bisogna utilizzare questo escamotage!

[fcaldera]

lascia stare i posizionamenti assoluti: possono essere problematici se non compresi pienamente quindi prova molto più semplicemente così

#container {
width: 800px;
margin: 0 auto;
text-align: left;
}

poi c'è un problema sulla larghezza delle colonne in firefox e sul footer:
cambia così:

stile.css (line 67)
#colonnasx {
float:left;
display: inline;
width:200px;
}

stile.css (line 98)

#colonnadx {
float:left;
text-align:left;
width:579px;
}

stile.css (line 59)
#corpo {
background-image:url(images/sfondo.jpg);
height:auto;
margin:0pt auto;
overflow:hidden;
width:800px;
}

p.MAIL {stile.css (line 124)
margin:0;
padding:1.5em;
}

Ciao