Falsche Darstellung im IE

[Tim]

Hallo zusammen, ich bin dabei eine mit CSS kleine Homepage zu machen.
Eigentlich sollte sie so aussehen wie im Firefox: http://timconzelmann.de/hp1.jpg der Internet Explorer lässt die blaue Zeile allerdings anderes darstellen: http://timconzelmann.de/hp2.jpg

Gibt es eine Möglichkeit dieses Problem zu umgehen?

Habe es wie folgt geschrieben:
css-datei:
 body {
  margin: 1;
  padding: 0;
  background-image: url(bilder/bg.jpg);
 }

#container {
  width: 670px;
  margin: auto
 }

#top1 {
  width: 148px;
  height: 144px;
  text-align: justify;
  background-color: #FFFFFF;
  float:left;
 }

#top2 {
  margin:auto;
  width: 522px;
  height: 144px;
  text-align: justify;
  background-color: #FFFFFF;
  float:left;
 }

#navi {
  vertical-align:middle;
  margin:auto;
  width: 670px;
  height: 168px;
  text-align: center;
  background-color: #557FAA;
 }

#inhalt {
  margin:auto;
  width: 670px;
  height: 400px;
  text-align: justify;
  background-color: #FFFFFF;
 }

und so in html eingebunden:
<div id="container">
<div id="top1"><p class="aussenabstand"><img src="bilder/mgv_logo.gif" alt="" border="0"></p></div>
<div id="top2"><h1>Männergesangverein 1862 Binsdorf e.V.</h1><br><h2>72351 Geislingen-Binsdorf<br>
Kontakt: <a href="mailto:[e-mail]">[e-mail]</a></h2></div>
</div>
<div id="navi">ermine - Impressum - Gästebuch</div>
<div id="inhalt"></div>

Wäre um jeden Tipp dankbar, und wenn ihr bessere Möglichkeiten habt die Seite mit CSS aufzubauen immer her damit, bin noch in der Lernphase ;-)