JürgenB: margin und float

Beitrag lesen

Hallo alle,

ich möchte einem div etwas Abstand vom linken Rand geben, das mache ich mit margin-left. Zusätzlich gebe ich dem div die Eigenschaft float:left mit:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">  
<title>Test</title>  
<style type="text/css">  
 #nav    { margin-left:120px;width:620px;float:left; }  
 #cont   { margin-left:120px;width:620px;padding-top:20px;padding-bottom:20px;clear:both }  
</style>  
</head>  
<body>  
<div id="nav">  
 link link link link  
</div>  
<div id="cont">  
 <p>Text</p><p>Text</p>  
</div>  
</body>  
</html>  

Im Firefox klappt das auch, im IE hat aber das Hinzufügen von float:left zum css zur Folge, dass der Rand doppelt so groß angezeigt wird. Im obigen Beispiel haben im Firefox beide DIVs den gleichen Abstand zum linken Rand, im IE ist beim 1. div der Abstand doppelt so groß. Ohne float:left stimmt alles. Kennt jemand das Problem und weiß Abhilfe?

Gruß, Jürgen