Mastershrimp: Div verschiebt sich wenn padding o. border = 0

Beitrag lesen

Heyho!

Ich stehe z.Z. vor einem sehr merkwürdigen Problem, welches sowohl im IE als auch in FF auftritt.

Mein Markup sieht in etwa wie folgt aus:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<HTML>  
<HEAD>  
...  
</HEAD>  
  
<BODY id="body_1234">  
  
<h1 id="header">...</h1>  
  
<div id="container">  
  
    <div id="content">  
    ...  
    </div>  
  
    <p id="footer">  
    ...  
    </p>  
  
</div>  
  
</BODY>  
  
</HTML>  

Wenn ich nun beim Container einen 1px-Rahmen oder ein padding-top:1px setze, sieht das ganze so aus:

border:
Screenshot (blau: body; orange: header; rot: container; gelb: content)

padding:
Screenshot (rot: container mit 1px padding; grün: content; blau: footer)

Lasse ich diese Angaben allerdings weg (also border:none und padding:0px) rutscht der Container aus mir unerfindlichen Gründen ein Stück runter:
Screenshot

Sowohl die Seite als auch das CSS sind valide. Das Verhalten tritt sowohl im IE als auch in FF (1.5) auf.

Hat jemand irgendeine Ahnung woran das liegen kann?

Ich habe momentan einen padding-top von 1px gesetzt, was meinem Layout auch nicht schadet. Insofern hab ich schonmal zumindest ein "workaround" für das Problem. Dennoch wüsste ich gerne, warum dieses merkwürdige Verhalten auftritt und würde gerne das Workaround nicht benutzen müssen.

Vielen Dank schonmal für eure Antworten!

Gruß

Mastershrimp