Mise en page css mozilla et chrome

Bonjour,

je développe un site web et sous google chrome la css fonctionne nickel. Mais sou mozilla, explorer sa pose probleme voici ma css :

body 
{ 
  
 background : url(images/fond.gif); 
 margin: 10px 0 ; 
 padding: 0 ; 
 text-align: center ; 
 font: 0.8em "Trebuchet MS", helvetica, sans-serif ; 
 font-size : 13px; 
} 

div#conteneur 
{ 
 list-style-type:none; 
 position: absolute; 
 width: 1000px ; 
 margin-left: 340px ; 
 text-align: left ; 
 border: 3px solid #5babe8 ; 
 border-radius : 20px 20px 20px 20px; 
 box-shadow : 6px 6px 6px grey; 
 background: #eaeaea ; 
} 

div#contenu 
{ 
 padding: 0 25px 0 100px ; 
 background: url(bg_page.gif) no-repeat 15px 15px ; 
} 

div#souscontenu 
{ 
 margin-right : 70 px; 
 margin-bottom : 30 px; 
 padding: 10px 70px 10px 70px ; 
 background: #aaded7 no-repeat 15px 15px ; 
 border-radius : 10 px; 
 box-shadow : 6px 6px 6px grey inset; 


div#gauche{ 
 position: absolute; 
 background: #eaeaea ; 
 margin-left: 5px ; 
 margin-top: 130px ; 
 width: 320 px; 
 border: 3px solid #5babe8 ; 
 border-radius : 20px; 
 box-shadow : 6px 6px 6px grey; 
} 

div#droite{ 
 background: #eaeaea ; 
 position : absolute; 
 margin-top: 125px ; 
 margin-left: 1355px ; 
 width: 320 px; 
 border: 3px solid #5babe8 ;  
 border-radius : 20px; 
 box-shadow : 6px 6px 6px grey; 
} 

div#droite h2 
{ 
 padding-left: 25px ; 
 line-height: 25px ; 
 font-size: 1.4em ; 
 background: url(little_apple.gif) no-repeat left bottom ; 
 color: #9b2 ; 
 border-bottom: 1px solid #9b2 ; 

} 

et donc dans mozzilla le div#droite passe derriere conteneur
et les effet arrondit disparaissent
et dans internet explorer tout est décaler sur la droite laissant un grand espace vide a gauche
pourriez vous m'éclairer pour avoir un beau site quelque soit le navigateur

Cordialement


un bon post est un post en français,sans abrégé et avec une vrai question en titre
N'oubliez pas de faire résolu pour les prochains à avoir votre problème