Wiesel: Warum die Meldung: Warnung: inserting implicit <p>

Beitrag lesen

Hallo ChrisB,
ich habe zu früh gejubelt.
Wenn ich clear:left angebe, rutscht die Zeile zwar unter das Bild, aber leider viel zu weit.
Nachdem ich um die einzelnen Elemente Rahmen gelegt habe, bin auch auf folgende Ursache gestoßen.
In der Datei (Beispiel unten) wird bei
  #Navigation und bei img#Bild1 jeweils float:left angegeben.
Durch das clear:left (am Ende des Beispiels) rutscht der Text "Demnächst hier" nicht direkt unter das Bild, wie ich angenommen hatte, sondern unter das mit Navigation definierte Element.

Wie kann ich erreichen, dass sich das clear nur auf das letzte float bezieht?
Gruß
Wiesel

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>Test</title>  
<style type="text/css">  
  #Navigation {  
                                                         float:left;  
    width:220px;  
  
border-style:dashed;border-color:red;border-width:2px;  
  
  }  
  
  #Inhalt {  
    margin-left:240px; margin-top:0;  
  
border-style:dashed;border-color:green;border-width:2px;  
  
  }  
  
  img#Bild1 {  
                                                         float: left;  
    width:400px;  
    height:300px;  
  
border-style:dotted;border-color:gray;border-width:1px;  
  
  }  
  div#Titel {  
    margin-left: 440px;  
  }  
  div#Text {  
    margin-left: 440px;  
  }  
</style>  
</head>  
<body>  
<div id="Navigation">  
<ul>  
  <li>Aktuelle Informationen</li>  
  <li>----1-------</li>  
  <li>----2-------</li>  
  <li>----3-------</li>  
  <li>----4-------</li>  
  <li>----5-------</li>  
  <li>----6-------</li>  
  <li>----7-------</li>  
  <li>----8-------</li>  
  <li>----9-------</li>  
  <li>---10-------</li>  
  <li>---11-------</li>  
  <li>---12-------</li>  
  <li>---13-------</li>  
  <li>---14-------</li>  
  <li>---15-------</li>  
  <li>---16-------</li>  
  <li>---17-------</li>  
  <li>---18-------</li>  
  <li>---19-------</li>  
  <li>---20-------</li>  
  <li>---21-------</li>  
  <li>---22-------</li>  
  <li>---23-------</li>  
  <li>---24-------</li>  
  <li>---25-------</li>  
  <li>---26-------</li>  
  <li>---27-------</li>  
  <li>---28-------</li>  
  <li>---29-------</li>  
  <li>---30-------</li>  
  <li>---31-------</li>  
  <li>---32-------</li>  
  <li>---33-------</li>  
  <li>---34-------</li>  
  <li>---35-------</li>  
  <li>---36-------</li>  
  <li>---37-------</li>  
  <li>---38-------</li>  
  <li>---39-------</li>  
  
</div>  
<div id="header">  
<div id="Inhalt">  
<img id="Bild1" src="http://www.example.com/bild1.jpg" alt="Bild1">  
<div id="Titel">Bildüberschrift</div>  
<div id="Text">Bildtext1<br>Bildtext2<br>Bildtext3</div>  
  
<h3 style="clear:left;">Demnächst hier!</h3>  
  
</div>  
</body>  
</html>