Footer probleme

[CSSMensch]

Hallo, mein Css Layout macht mir einige Probleme, entweder es sieht im Internet Explorer richtig aus und im Firefox nicht( er steht immer 50px unter dem Gerüst ), oder umgekehrt, hab keine Ahnung was ich da ändern muss. Hab alle Varianten von Position und Padding durch, damit ändert sich aber maximal der Abstand zum unteren Browserrand... Wäre über Hilfe sehr dankbar.

Quelltext der CSS:

body {
 background:#fffef4;
 color: #333333;
 text-align:center;
 padding:0;
 }

#outer {
 text-align:left;
 width:902px;
 margin:auto;
 }

#hdr {
 height:115px;
 background:#fff1aa;
 color: #333333;
 }

#bodyblock {
 background: #FFFef4;
 color: #333333;
 width:auto;
 min-height:400px;
 height:auto;
 height:100%;
 }

#l-col {
 float:left;
 background:#FFFef4;
 color: #333333;
 width:145px;
 min-height:400px;
 height:auto;
 height:100%;
 }

#cont {
 width:718px;
 background:#fffef4;
 color: #333333;
 border-width:0 0 0 1px;
 min-height:400px;
 height:100%;
 height:auto;
 margin:0px;
 }

#ftr {
 height:10px;
 margin:0px; }

Und der Quelltext der HTML:

<div id="outer">
<div id="hdr" align="center">
<iframe src="oben.htm" width="100%" height="115" align="middle" name="oben" scrolling="no" marginheight="0" marginwidth="0" frameborder="0">
</iframe>
                <------ hier der </div> Tag für den IE
<div id="bodyblock" align="right">
 <div id="l-col">
 <iframe src="menuleer.htm" width="181px" height="402px" name="menü1" scrolling="no" frameborder="0"></iframe>
 </div>
 <div id="cont">
 <iframe src="main.htm" width="718px" height="402px" name="cont" frameborder="0" scrolling="Auto"></iframe>
 </div>
 </div>
        </div>
 <div id="ftr">
 <iframe src="unten.htm" width="902px" height="10px" name="ftr" frameborder="0" scrolling="no"></iframe>
</div>

</div>   <----- wenn ich den Tag nach siehe oben verschiebe klappts im IE aber im Firefox nicht mehr, wenn er hier steht ist es umgekehrt.

Hoffe er ist nicht zu verwirrend.

[CSSMensch]

So, hab die Lösung gefunden, lag am mangelnden Doctype Tag.