HO realizzato una pagina web, e per testarla avevo a disposizione IE 5 ( )

La pagina è in xhtml, e la formattazione è fatta attraverso un css.

La larghezza della pagina è di 780px.

Dentro questi 780px, ho realizzato due box di 390px (la metà) uno accanto all'altro...

E qui iniziano i problemi: nonostante ho aplicato il box bodel hack, la pagina non funzionava correttamente con IE5 (che avevo a disposizione, e non potevo in nessun modo cambiare ): i due box non occupavano l'intero box da 780px, rimaneva molto spazio sulla destra...

Così ho iniziato a mettere margin di qui e di là.. e tadà... Adesso con IE5 la pagina si vede alla perfezione.. Ma con gli altri browser non ne parliamo...

Avevo visto fin da subito che non avrebbe funzionato un lavoro del genere, ma d'altronde dovevo risolvere il problema come grande capo voleva...

questo è il css incriminato (Per favore non mi dite che i conti non tornano, perchè lo so già da sola):

body {
text-align: center;
margin: 10px 0px;
padding: 0px;
background: url(sfondo.gif);
font-family: Tahoma, Arial, sans-serif;
font-size: 14px;
color: #000000;
}
#logo {
margin: 10px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
height: 100px;
font-size: 0px;
text-align: left;
border: 0px;
background: #006600;
overflow: hidden;
}
#main {
margin: 0px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
text-align: left;
border: 0px;
}
#introduzione {
margin: 0px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #000000;
text-align: justify;
border: 0px;
}
#introduzione img {
border: 1px solid #000000;
}
.testointroduzione {
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 0px 0px 0px 0px;
text-align: justify;
background-color: #99cc99;
float: left;
height: 250px;
}
.testointroduzione2 {
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 0px 0px 0px 40px;
text-align: justify;
background-color: #99cc99;
float: left;
height: 250px;
}
#introduzione2 {
margin: 0px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #000000;
text-align: justify;
border: 0px;
font-weight: bold;
}
#introduzione2 img {
border: 1px solid #000000;
}
.infoprenotazioni {
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 0px 20px 0px 0px;
text-align: justify;
float: left;
}
.infoprenotazioni2 {
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 0px 0px 0px 20px;
text-align: justify;
float: left;
}
#clearer {
clear: both;
}
#info {
width: 150px;
w\idth: 148px;
\width: 148px;
padding: 1px;
margin: 10px 0px;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #0000000;
text-align: center;
border: 1px solid #000000;
display: block;
background-color: #99cc99;
clear: both;
}
#info2 {
width: 150px;
w\idth: 148px;
\width: 148px;
padding: 1px;
margin: 10px 0px;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #0000000;
text-align: center;
border: 1px solid #000000;
display: block;
background-color: #99cc99;
clear: both;
}
.contenuto {
margin: 10px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
text-align: left;
}
.immagini {
float: left;
width: 390px;
w\idth: 380px;
\width: 380px;
padding: 0px;
margin: 5px 0px 5px 0px;
text-align: justify;
}
.immagini img {
border: 1px solid #ffffff;
}
.immaginidestra {
float: left;
width: 390px;
w\idth: 380px;
\width: 380px;
padding: 0px;
margin: 5px 0px 5px 30px;
text-align: right;
}
.immaginidestra img {
border: 1px solid #ffffff;
}
.testo {
float: left;
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 5px 0px 5px 0px;
text-align: justify;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #000000;
background-color: #99cc99;
}
.testodestra {
float: left;
width: 390px;
w\idth: 370px;
\width: 370px;
padding: 5px;
margin: 5px 0px 5px 30px;
text-align: justify;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #000000;
background-color: #99cc99;
}
.testo img {
border: 1px solid #000000;
}
#footer {
claer: both;
font-family: Tahoma, Arial, sans-serif;
font-size: 11px;
color: #000000;
margin: 20px auto;
width: 780px;
w\idth: 780px;
\width: 780px;
padding: 0px;
text-align: center;
border-top: 1px solid #000000;
background-color: #99cc99;
}
a {
color: #000000;
}
a:hover {
color: #ffffff;
}
a.info {
color: #000000;
font-weight: bold;
text-decoration: none;
}
a.info:hover {
color: #000000;
font-weight: bold;
text-decoration: none;
}

E questa è la pagina in questione: