Problème de compatibilité firefox/ IE

Bonjour,

je suis en train de faire un site internet pour une association de basket et j'ai un problème au niveau de l'affichage du site tout fonctionne correctement sur Firefox mais sur Internet Explorer cela déconne.

Je m'explique, j'ai décidé de faire 3 blocs aligné de manière horizontale (menu gauche, corps et menu à droite)

le problème est le menu de droite (id=abcn) qui revient sur le corps sous internet explorer.
je n'arrive pas à comprende pourquoi cela ne fonctionne pas


ma page html




<div id="menu">
<!-- Ici on mettra le menu -->

<ul class="navigation">

<li><a href="index.html" title="Accueil">Accueil</a></li>

<li class="toggleSubMenu"><span>Le Club</span>
<ul class="subMenu">
<li><a href="historique.html" title="Historique">Historique</a></li>
<li><a href="bureau.html" title="Le Bureau">Le Bureau</a></li>
<li><a href="staff.html" title="Le Staff">Le Staff</a></li>
<li><a href="les_equipes.html" title="Les Équipes">Les Équipes</a></li>
<li><a href="information_inscription.html" title="Information Inscription">Information Inscription</a></li>

</ul>
</li>

<li class="toggleSubMenu"><span>Nationale 3</span>
<ul class="subMenu">

<li><a href="calendrier.html" title="Calendrier">Calendrier</a></li>
<li><a href="equipe.html" title="L'Équipe">L'Équipe</a></li>
<li><a href="joueurs.html" title="Les Joueurs">Les Joueurs</a></li>
<li><a href="presse.html" title="Presse">Presse</a></li>


</ul>
</li>

<li class="toggleSubMenu"><span>Partenaires</span>
<ul class="subMenu">

<li><a href="partenaires.html"title="Nos Partenaires">Nos Partenaires</a></li>
<li><a href="devenir_partenaire.html" title="Devenir Partenaire">Devenir Partenaire</a></li>

</ul>
</li>

<li><a href="planning.html" title="Planning WE">Planning WE</a></li>

<li class="toggleSubMenu"><span>Multimédia</span>
<ul class="subMenu">

<li><a href="photos.html" title="Photos">Photos</a></li>
<li><a href="videos.html" title="Vidéos">Vidéos</a></li>
<li><a href="presse1.html" title="Presse">Presse</a></li>

</ul>
</li>

<li><a href="forum.html" title="Forum">Forum</a></li>

<li class="toggleSubMenu"><span>Pratique</span>
<ul class="subMenu">

<li><a href="plan.html" title="Plan d'accès">Plan d'accès</a></li>
<li><a href="reglements.html" title="Règlements">Règlements</a></li>
<li><a href="liens.html" title="Liens">Liens</a></li>

</ul>
</li>

<li><a href="contact.html" title="Contact">Contact</a></li>

</ul>
</div>






<div id="corps">

<div id="principale">








<div class="meteo">

<script>
//Live weather feeds by freemeteo.com
//The use of this script is bound by Freemeteo's Live Feed Service Agreement, as is published in the following url: https://freemeteo.co.uk/
// You are not allowed to change or delete any part of this script.
// Main body background color : FFFFFF
// Main body fonts color : 000000
// Header/Footer background color : 6699FF
// Header/Footer fonts color : FFFFFF
cIfrm="14";
gid="789462_20101207_235438";
</script>
<script src="https://freemeteo.com/templates/default/HTfeeds.js" type="text/javascript"></script>

</div>

<div class="m1">

<h2> <strong> PROCHAIN MATCH N3 </strong> </h2>
<h3> <strong> A domicile </strong> </h3><br/>
<h4> <strong> Vendredi 17 décembre à 20h00 </strong> </h4>
<p> <img src="logoclub/abcn.jpg" alt="Logo Abcn" />
<img src="logoclub/brissac.jpg" alt="Logo Brissac" />
<br/> <strong>@ BRISSAC QUINCÉ</strong></p>

</div>



<div class="prog">

<p><a href="planning week end.pdf" title="programme du Week End">Le programme du Week End</a></p>



</div>



<div class="m2">

<h2> <strong> PROCHAIN MATCH CADETS 1</strong> </h2>
<h3> <strong> A domicile </strong> </h3><br/>
<h4> <strong> Dimanche 19 décembre à 15h30 </strong> </h4>
<p> <img src="logoclubbis/abcn.jpg" alt="Logo Abcn" />
<img src="logoclubbis/etendartdebrest.jpg" alt="Logo Etendart de Brest" />
<br/> <strong>@ ETENDART DE BREST</strong></p>

</div>















</div>
















<div id="abcn">

<table>
<tr>
<td><img src="1.jpg" alt="Saint-Nazaire" /></td>
</tr>
<tr>
<td><img src="2.jpg" alt="Airbus" /></td>
</tr>
<tr>
<td><img src="3.jpg" alt="Crédit Mutuel" /></td>
</tr>
<tr>
<td><img src="4.jpg" alt="Le Gal Entreprise" /></td>
</tr>
<tr>
<td><img src="5.jpg" alt="Aérolia" /></td>
</tr>
<tr>
<td><img src="6.jpg" alt="GPR Informatique" /></td>
</tr>
<tr>
<td><img src="7.jpg" alt="Groupe Daher" /></td>
</tr>
<tr>
<td><img src="8.jpg" alt="Eiffage" /></td>
</tr>
<tr>
<td><img src="9.JPG" alt="Tout Faire Matériaux" /></td>
</tr>
<tr>
<td><img src="10.JPG" alt="Autocars Brière Évasion" /></td>
</tr>
<tr>
<td><img src="11.jpg" alt="Domino's Pizza" /></td>
</tr>
<tr>
<td><img src="12.jpg" alt="Radio Côte d'Amour" /></td>
</tr>
<tr>
<td><img src="13.jpg" alt="Brasserie le Ponton" /></td>
</table>


</div>
</div>


ma page css



body
{
width: 1390px;
padding: 5px;
margin: auto; /* Pour centrer notre page */
margin-top: 10px;/* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-left: 10px;
background-color: rgb(0,66,0); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */


}

/* L'en-tête */

#en_tete

{
height:127px;
margin-top: 10px;
padding-top: 20px;
background-image: url("logo.jpg");
background-repeat: no-repeat;
}
.element_en_tete h1
{

margin-top: 10px;
font-family: "Times New Roman", Arial, Verdana, Georgia;
font-size: 75px;
color: white;
text-indent: 220px;


}


#menu
{
width: 160px;
padding-top: 27px;
margin: 0px;
float: left;
}

.navigation {

margin: 0px;
padding: 0px;
list-style: none;
color: #fff;
background: url(bouton.png);

font: 1.2em Arial, "Times New Roman", sans-serif;
}
.navigation a, .navigation span {
width: 140px;
display: block;

padding: 8px 10px;
color: rgb(0, 0, 0);
text-align: center ;
text-decoration: none;
background: url(bouton.png) left bottom no-repeat;
}
.navigation .toggleSubMenu a, .navigation .toggleSubMenu span {
background-image: url(bouton.png);
}
.navigation .open a, .navigation .open span {
background-image: url(bouton.png);
}
.navigation a:hover, .navigation a:focus, .navigation a:active {
display: block;
width: 140px;
outline:0;
padding: 8px 10px;

color: rgb(255, 255, 255);
background-image: url(bouton1.png);

}
.navigation .subMenu {
list-style: none;

background: no-repeat;
padding: 0px;
font-size: .9em ;
background: url(bouton.png);




}
.navigation ul.subMenu a {

}
#corps
{

width: 1200px;
margin-top: 27px;


}

#principale
{ margin-left: 175px;
height: 1222px;
padding: 0px;
background-color: rgb(255, 255, 255);


}


.meteo
{

float: right;

}

.m1
{
width: 300px;
height: 250px;
text-align: center;



}
.m1 p

{
line-height:1.3em;
margin:0;
padding:0;
font: 1.4em Arial, "Times New Roman", sans-serif;

}
.m1 h2
{
font: 1.2em Arial, "Times New Roman", sans-serif;

color: rgb(0, 0, 0);
text-align: center ;
margin:0;
padding:0;
padding-bottom: 15px;
}


.m1 h3
{
font: .9em Arial, "Times New Roman", sans-serif;

color: red;
text-align: center ;
margin:0;
padding:0;

}


.m1 h4
{
font: .9em Arial, "Times New Roman", sans-serif;

color: red;
text-align: center ;
margin:0;
padding:0;

}


.prog
{

width: 400px;
height: 100px;
text-align: center;

top: 0px;
padding-left: 280px;
padding-top: 70px;
}

.prog p
{
font: 1.2em Arial, "Times New Roman", sans-serif;
}







.m2
{
width: 300px;
height: 250px;
text-align: center;

padding-left: 700px;


}
.m2 p

{
line-height:1.3em;
margin:0;
padding:0;
font: 1.4em Arial, "Times New Roman", sans-serif;

}
.m2 h2
{
font: 1.2em Arial, "Times New Roman", sans-serif;

color: rgb(0, 0, 0);
text-align: center ;
margin:0;
padding:0;
padding-bottom: 15px;
}


.m2 h3
{
font: .9em Arial, "Times New Roman", sans-serif;

color: red;
text-align: center ;
margin:0;
padding:0;

}


.m2 h4
{
font: .9em Arial, "Times New Roman", sans-serif;

color: red;
text-align: center ;
margin:0;
padding:0;

}







#abcn table
{
position: absolute; /* -> 1 */
top: 0px;
right: 20px;
padding-top: 196px;

}