css horizontal

[Jule]

hallo,
ich habe ziemliche probleme mein 750 width, horizontal-layout zusammen zu bekommen wie vorgestellt.
eigentlich sollte es vier-spaltig horizontal werden:
ganz oben ein bild, width 750px und height 100,
direkt daran anschliessend die navigation - auch horizontal,
dann der content bereich, eigentlich mit einer min-width (was ich für den IE nicht hinbekomme).
am ende der footer der mit dem seitenende abschliessen soll, egal wieviel inhalt im content div.
anbei das was ich bisher wild zusammengeschrieben/gesammelt habe, im IE haben weder footer noch navi die gesammte breite des wrapper (container) und schliessen so nach rechts nich ab.
vielen dank für die hilfe!

/* global styles
-----------------------------------------------------------------------------*/

* { margin:0; padding:0; border:0; }

body {
 font:62,5% arial, helvetica, sans-serif
 text-align:center;
 margin:0px 10px;
 background:#666 url(../img/shadow-back.gif) repeat-y center;
 }
h1 {
 color:#5F6469;
 background-color:#F4F4F4;
 font:bold 2em/1.5em arial, helvetica, sans-serif;
 margin:0 0 0.5em 0;
 }
h3 {
 color:#5F6469;
 background-color:#D4D4D4;
 font:normal 1em/1.5em arial, helvetica, sans-serif;
 padding:0.1em 0 0 0.55em;
 margin:1.5em 0 0 0;
 }
h4 {
 color:#5F6469;
 font:bold 1.3em/1.3em arial, helvetica, sans-serif;
 margin:1.5em 0 0.2em 0;
 }
h5 {
 color:#4A525A;
 margin:1em 0 0.5em 0;
 font:normal 1em/0.5em arial, helvetica, sans-serif;
 }
p {
 margin:0 0 15px 0;
 }
b {
 color:#4D5257;
 }
table {
 border-collapse:collapse;
 }
td {
 border:1px solid grey;
 }

/* divs
-----------------------------------------------------------------------------*/

/*--- centering */

#wrapper {
 height:100%;
 width:740px;
 margin-top:1px;
 margin-bottom:0px;
 margin-right:auto;
 margin-left:auto;
 padding:0px;
 text-align:left;
 border-left:2px solid #ADADAD;
 border-right:2px solid #ADADAD;
 background-color:#F4F4F4;
 }

/*--- banner */

#banner {
 height:100px;
 background-color:#F4F4F4;
 }
#banner img {
 display:block;
 }
#banner h1 {
 display:none;
 font-size:1em;
 }

/*--- topnavi */

#topnavi {
 color:#4A525A;
 float:left;
 width:100%;
 border-bottom:1px solid #4A525A;
 border-top:1px solid #4A525A;
 background-color:#818987;
 }
#topnavi ul {
 padding-left:0px;
 list-style-type: none;
 }
#topnavi li {
 border-left:1px solid #4A525A;
 }
#topnavi ul li {
 display: block;
 float:left;
 font: 0.8em/20px arial, helvetica, sans-serif;
 text-align:center;
 }
#topnavi a {
  display:block;
 padding:0px 15px;
  background-color:#818987;
  text-decoration:none;
 }
#topnavi a:link, #topnavi a:visited {
 color:#F4F4F4;
 text-decoration:none;
 }
#topnavi a:hover {
 background-color:#A8ADAC;
 color:#F4F4F4;
 }
#topnavi .red {
 background-color:#CC0000;
 }
#topnavi .border {
 border-right:1px solid #4A525A;
 }

/*-- content */

#content {
 height:100%;
 padding:10px;
 color:#4A525A;
 margin:30% 0 0 0;
 width:740px;
 }

/*--- footer */

#footer {
 width:740px;
 padding:0px;
 color:#4A525A;
 text-align:center;
 font:.7em/1.5em arial, helvetica, sans-serif;
 border-top: 1px solid #96958B;
 background-color:#ccc;
  }